1

<select><option>私をラジオボタンに変換する方法について混乱しています。

この simpleCart(js) プロジェクトで正しく機能するようにこのドロップダウン メニューを設定するのに何日も費やした後、私のクライアント (嬉しいことに) は考えを変え、代わりにボタンが必要であると判断しました。

この変更を実装する正しい方法は何でしょうか。ラジオボタンを試しましたが、これまでに行ったことは機能しません。私が作成したフォームは、simpleCart(js) と通信していないようです。

私が持っていたもの(完全に機能している)

<select id="sizeSelect" class="item_size dropdown" autocomplete="off">
    <option value="nul" selected="selected">Please choose size</option>
    <option value="Small">Small</option>
    <option value="Medium">Medium</option>
    <option value="Large">Large</option>
    <option value="Super Brain">Super Brain</option>
    </select>

    <select id="shippingSelect" class="item_shipping" autocomplete="off">
    <option value="nul" selected="selected">Please choose shipping</option>
    <option value="ups">UPS Standard 25€&lt;/option>
    <option value="mail">Standard Mail 10€&lt;/option>
    </select>
    <select id="regionSelect" class="item_tax" autocomplete="off">
    <option value="nul" selected="selected">Please choose region</option>
    <option value="Eu VAT 21%">Eu VAT 21%</option>
    <option value="World (Taxfree)">World (Tax Free)</option>
    </select>

<button class="item_add">Add to Cart</button>

私が試していること(機能していない)

<form>
<fieldset>
<legend>Please choose size:</legend>
<input type="radio" name="size" id"sizeSelect" class="item_size" value="nul" style="display:none" checked>  
<label><input type="radio" name="size" id"sizeSelect" class="item_size" value="small"> Small </label>
<label><input type="radio" name="size" id"sizeSelect" class="item_size" value="medium"> Medium </label>
</fieldset>
<fieldset>
<legend>Please choose shipping:</legend>
<input type="radio" name="shipping" id="shippingSelect" class"item_shipping" value="nul" style="display:none" checked>
<label><input type="radio" name="shipping" id="shippingSelect" class"item_shipping" value="ups"> UPS Standard 25€&lt;/label>
<label><input type="radio" name="shipping" id="shippingSelect" class"item_shipping" value="mail"> Standard Mail 10€&lt;/label>
</fieldset>
<fieldset>
<legend>Please choose destination:</legend>
<input type="radio" name="destination" id="destinationSelect" class"item_price" value="nul" style="display:none" checked>
<label><input type="radio" name="destination" id="destinationSelect" class"item_price" value="290.00"> EU</label>
<label><input type="radio" name="destination" id="destinationSelect" class"item_price" value="220.00"> World</label>
</fieldset>
<input type="submit" class="item_add " value="Add to Cart">
</form>

アップデート

class="item_sizeitまたはその他の SC クラスを使用して、データをカートにフィードするだけで十分です。

アップデート

カート HTML:

    <div class="simpleCart_items"></div>
    <div class="simpleCart_itemSize"></div>
    Shipping:<span class="simpleCart_shipping"></span><br> 
    <strong>Total with Shipping: <span class="simpleCart_grandTotal"></span></strong>
    <p style="text-align:right"><a href="javascript:;" class="simpleCart_checkout">Checkout</a></p>

ラジオボタンを使用すると、次の総計が得られます

送料込みの合計: €NaN

そのため、フォームがカートと通信していないことは明らかです.. しかし、プラグが緩んでいる場所は私にとって完全な謎です..

更新 申し訳ありませんが、欲求不満でこれを入れるのを忘れていました...

    <script type="text/javascript">
    simpleCart.shipping = function(){
    if( $("#shippingSelect").val() == "nul" ){return 0;}    
    if( $("#shippingSelect").val() == "ups" ){return 25;}
    if( $("#shippingSelect").val() == "mail" ){return 10;}
    };
    </script>

    <script type="text/javascript">
    simpleCart.tax = function(){
    if( $("#regionSelect").val() == "nul" ){return 0;}  
    if( $("#regionSelect").val() == "Eu VAT 21%" ){return 90;}
    if( $("#regionSelect").val() == "World (Taxfree)" ){return 0;}
    };
    </script>   
4

1 に答える 1