0

I am setting up a simpleCart(js) with some selectable options.  I need to show an alert if not all drop-downs meet some value, and also to block the "Add to cart" from adding items to the cart (if not all drop-downs have met some value) This is as far as I manage, any help is highly appreciated .

The HTML

        <p>
        <div class="simpleCart_shelfItem">
        <h2 class="item_name" style="display:none">TEST</h2>
        <select id"sizeSelect" class="item_size">
        <option value="nul">Please choose size</option>
        <option value="small">Small</option>
        <option value="medium">Medium</option>
        <option value="large">Large</option>
        <option value="xlbrain">Super brain</option>
        </select>

        <select id="shippingSelect" onchange="simpleCart.update();">
        <option value="nul">Please choose shipping</option>
        <option value="ups">UPS Standard 25€&lt;/option>
        <option value="mail">Standard Mail 10€&lt;/option>
        </select>


        <select id"destiantionSelect" class="item_price">
        <option value="nul">Please choose destination</option>
        <option value="290.00">EU</option>
        <option value="220.00">World</option>
        </select></p>

        <p><a class="item_add" onclick="selected()" href="javascript:;">Add to Cart </a></p>
        </div>


The shipping cost added to the grand total

        <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>


The alert

        <script type="text/javascript">
        function selected() {
        var ddl = document.getElementById("shippingSelect","sizeSelect","destinationSelect");
        var selectedValue = ddl.options[ddl.selectedIndex].value;
        if (selectedValue =="nul")
        { alert("Please choose one from all options")}
        }

        </script>
4

1 回答 1

0

我将 a 按钮更改为实际按钮并使用 jquery 并绑定单击事件来检查选项框，如果它们匹配 nul 则返回，而且您的 id 上也缺少一些 =。

$('.item_add').click(function () {
if($('#sizeSelect').val().match(/nul/)) return alert("Please choose a size");
if($('#shippingSelect').val().match(/nul/)) return alert("Please choose shipping type");
if($('#destinationSelect').val().match(/nul/)) return alert("Please enter a destination");
});

http://jsfiddle.net/y2Cf9/

于 2013-09-16T19:24:29.910 回答