Próbuję tylko wrócić true / false w jednym moim sposobie moich jQuery w zależności od kontroli 2 przycisków radiowych, a jeśli zostanie wybrany lub nie

Próbowałem kilku rzeczy, ale nie byłem w stanie uzyskać tego prawa, nadal przesyła formularz bez podawania błędu, że przyciski nie są wybrane.

Kod 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;
    }
0
Antony Star 28 czerwiec 2017, 08:56

3 odpowiedzi

Najlepsza odpowiedź

Jeśli prawidłowo rozumiem twoje pytanie, tak podoba ci się tylko ten test, czy oba przyciski radiowe są sprawdzane. Obecnie zaznaczono jeden przycisk radiowy w każdej grupie, zmienna kodu zostanie ustawiona na true, ignorując stan drugiego przycisku radiowego.

Na przykład, jeśli sprawdzono tylko jeden z przycisków radiowych {X0}}, zmienna shippingSelected byłaby ustawiona na true i pozostałoby to prawdą.

Sposób na naprawienie tego jest rozpoczęcie od shippingSelected i paymentSelected ustawiony na true, a jeśli jeden z przycisków radiowych zostanie odznaczony, zmienna zostanie ustawiona na false.

Oto przykład:

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
hyrumcoop 28 czerwiec 2017, 06:14

Spróbuj poniżej kodu,

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>
0
Jaydeep Mor 28 czerwiec 2017, 06:20

Możesz użyć $("#payment_1").checked, aby sprawdzić, czy radio jest sprawdzane, czy nie. Podobnie możesz użyć innego identyfikatora, aby sprawdzić, czy są wybrane, czy nie.

Oto skrzypce: https://jsfiddle.net/BF8BO43T/

0
Nisarg 28 czerwiec 2017, 06:12