2017-06-28 18 views
0

私はちょうど2つのラジオボタンのチェックに応じて、1つの私の私のjQueryのメソッドでfalseを/ trueを返すようにしようとしているチェックされ、それが選択されている場合は、私はいくつかのことを試してみたではないチェック特定のラジオボタンが

この権利を得ることができず、ボタンが選択されていないというエラーを出さずにフォームを送信します。

HTMLコード

<label class="checkout-item" for="payment_1">Cash On Delivery</label> 
<input type="radio" name="payment" class="radio" id="payment_1" value="3" iscod="1" onclick="selectPayment(this)"> 

<label class="checkout-item" for="payment_2">Credit Card/Debit Card</label> 
<input type="radio" name="payment" class="radio" id="payment_2" value="9" checked="" iscod="0" onclick="selectPayment(this)"> 

<label class="checkout-item" for="ECS_NEEDINSURE_1">Home Delivery</label> 
<input name="shipping" type="radio" id="ECS_NEEDINSURE_1" value="3" checked="true" supportcod="1" insure="0" class="radio" onclick="selectShipping(this)"> 

<label class="checkout-item" for="ECS_NEEDINSURE_2">Self-pickup</label> 
<input name="shipping" type="radio" id="ECS_NEEDINSURE_2" value="8" supportcod="1" insure="0" class="radio" onclick="selectShipping(this)"> 

Javascriptを

function checkOrderForm(frm) { 
    var paymentSelected = false; 
    var shippingSelected = false; 

    // Check whether the payment method is selected 
    for (i = 0; i < frm.elements.length; i++) { 
     if (frm.elements[i].name == 'shipping' && frm.elements[i].checked) { 
      shippingSelected = true; 
     } 

     if (frm.elements[i].name == 'payment' && frm.elements[i].checked) { 
      paymentSelected = true; 
     } 
    } 

    if (!shippingSelected) { 
     alert(flow_no_shipping); 
     return false; 
    } 

    if (!paymentSelected) { 
     alert(flow_no_payment); 
     return false; 
    } 
+1

なぜchecked属性を使用していませんか? – madalinivascu

+0

https://stackoverflow.com/a/2272532/2134604 –

+0

私が間違いを犯していると思ったら詳しい説明をしてください –

答えて

0

私が正しくあなたの質問を理解していた場合は、ラジオボタンの両方がチェックされた場合に合格するためにのみ、このテストしたいと思います。現在、各グループのラジオボタンが1つのみチェックされている限り、コード変数はtrueに設定され、他のラジオボタンの状態は無視されます。

たとえば、shippingラジオボタンのうちの1つだけがチェックされている場合、shippingSelected変数はtrueに設定され、trueのままになります。

これを修正する方法は、shippingSelectedpaymentSelectedがtrueに設定されており、ラジオボタンの1つがチェックされていない場合、変数はfalseに設定されます。ここで

は例です:

var paymentSelected = true; 
var shippingSelected = true; 

// Check whether the payment method is selected 
for (i = 0; i < frm.elements.length; i++) { 
    if (frm.elements[i].name == 'shipping' && !frm.elements[i].checked) { 
     shippingSelected = false; 
    } 

    if (frm.elements[i].name == 'payment' && !frm.elements[i].checked) { 
     paymentSelected = false; 
    } 
} 
0

あなたはラジオがチェックされているかどうかをチェックするために$("#payment_1").checkedを使用することができます。同様に、他のIDを使用して、それらが選択されているかどうかを確認することもできます。ここで

はフィドルです: https://jsfiddle.net/bf8bo43t/

0

HTML

<form method="post" name="frm_payment_types"> 
    <label class="checkout-item" for="payment_1">Cash On Delivery</label> 
    <input type="radio" name="payment" class="radio" id="payment_1" value="3" iscod="1" onclick="selectPayment(this)"> 

    <label class="checkout-item" for="payment_2">Credit Card/Debit Card</label> 
    <input type="radio" name="payment" class="radio" id="payment_2" value="9" iscod="0" onclick="selectPayment(this)"> 

    <label class="checkout-item" for="ECS_NEEDINSURE_1">Home Delivery</label> 
    <input name="shipping" type="radio" id="ECS_NEEDINSURE_1" value="3" supportcod="1" insure="0" class="radio" onclick="selectShipping(this)"> 

    <label class="checkout-item" for="ECS_NEEDINSURE_2">Self-pickup</label> 
    <input name="shipping" type="radio" id="ECS_NEEDINSURE_2" value="8" supportcod="1" insure="0" class="radio" onclick="selectShipping(this)"> 
    <br /> 
    <input type="submit" name="submit" onclick="return checkOrderForm();" /> 
</form> 

、コードの下に試してみてくださいJavascriptを

<script type="text/javascript"> 
    function validateForm(){ 
     var payment_1 = document.getElementById('payment_1'); 
     var payment_2 = document.getElementById('payment_2'); 

     var ECS_NEEDINSURE_1 = document.getElementById('ECS_NEEDINSURE_1'); 
     var ECS_NEEDINSURE_2 = document.getElementById('ECS_NEEDINSURE_2'); 

     if((payment_1.checked == true || payment_2.checked == true) && (ECS_NEEDINSURE_1.checked == true || ECS_NEEDINSURE_2.checked == true)){ 
      return true; 
     } 
     else if(payment_1.checked == false && payment_2.checked == false){ 
      alert("Please select Cash On Delivery or Credit Card/Debit Card."); 
     } 
     else if(ECS_NEEDINSURE_1.checked == false && ECS_NEEDINSURE_2.checked == false){ 
      alert("Please select Home Delivery or Self-pickup."); 
     } 
     return false; 
    } 
</script> 
関連する問題