Nie można sprawdzić przycisku radiowego zgodnie z wartością i trzeba sprawdzić poprawność za pomocą Javascript/Jquery

Question

Potrzebuję pomocy. Muszę sprawdzić przycisk radiowy zgodnie z wartością, biorąc identyfikator i potwierdzić te przy użyciu Javascript/Jquery. Wyjaśniam mój kod poniżej.

<div> 
    <input type="radio" name="rd0" value="57db18">Raj 
    <input type="radio" name="rd0" value="57da17">Rahul 
    <input type="radio" name="rd0" value="57db19">Mona 
</div> 
<br> 
<br> 
<div> 
    <input type="radio" name="rd1" value="57db18">A 
    <input type="radio" name="rd1" value="57da17">B 
    <input type="radio" name="rd1" value="57db19">C 

</div> 
<br> 
<br> 
<div > 
    <input type="radio" name="rd2" value="57db18">Apple 
    <input type="radio" name="rd2" value="57da17">Orange 
    <input type="radio" name="rd2" value="57db19">Mango 

</div> 
    <span> 
     <button type="button" id="btn" name="btn" onclick="setValue()">Set</button> 
    </span> 
    <span> 
     <button type="button" id="vbtn" name="vbtn" onclick="validateRadioButtonValue()">Validate</button> 
    </span> 

Tutaj mam 3 zestaw przycisku radiowego i gdy użytkownik kliknie na przycisk set przycisk radiowy powinien sprawdzić, jak na danej wartości w pętli. część skryptowa jest podana poniżej.

var valu = ['57da17', '57db18', '57db19']; 
function setValue(){ 
    for(var i=0;i<valu.length;i++){ 
     $('#rd'+i+'[value="' + valu[i]+ '"]').prop('checked', true); 
     console.log('checked btn',$('#rd'+i).is(':checked')); 
    } 
} 

ale w obecnym przypadku jej nie dzieje .Przy użytkownik będzie również przejrzeć validate przycisku, należy zweryfikować wszystko przycisk radiowy jest sprawdzana lub not.Please mi pomóc.

Answer 1

Spróbuj tego:

$('input[name=rd'+i+'][value="' + valu[i]+ '"]').prop('checked', true)

var valu = ['57da17', '57db18', '57db19']; 
 
function setValue(){ 
 
    for(var i=0;i<valu.length;i++){ 
 
      
 
     $('input[name=rd'+i+'][value="' + valu[i]+ '"]').prop('checked', true); 
 
     console.log('checked btn',$('input[name=rd' + i + ']').is(':checked')); 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <input type="radio" name="rd0" value="57db18">Raj 
 
    <input type="radio" name="rd0" value="57da17">Rahul 
 
    <input type="radio" name="rd0" value="57db19">Mona 
 
</div> 
 
<br> 
 
<br> 
 
<div> 
 
    <input type="radio" name="rd1" value="57db18">A 
 
    <input type="radio" name="rd1" value="57da17">B 
 
    <input type="radio" name="rd1" value="57db19">C 
 

 
</div> 
 
<br> 
 
<br> 
 
<div > 
 
    <input type="radio" name="rd2" value="57db18">Apple 
 
    <input type="radio" name="rd2" value="57da17">Orange 
 
    <input type="radio" name="rd2" value="57db19">Mango 
 

 
</div> 
 
    <span> 
 
     <button type="button" id="btn" name="btn" onclick="setValue()">Set</button> 
 
    </span> 
 
    <span> 
 
     <button type="button" id="vbtn" name="vbtn" onclick="validateRadioButtonValue()">Validate</button> 
 
    </span>

Answer 2

Wybieracie radio btns według ID (z "#"), gdy nie mają identyfikatora. Powinieneś wybrać je według nazwy.

z nazwą jQuery wybierz coś takiego:

var valu = ['57da17', '57db18', '57db19']; 
function setValue(){ 
    for(var i=0;i<valu.length;i++){ 
     $('input[name=rd'+i+'[value="' + valu[i]+ '"]').prop('checked', true); 
     console.log('checked btn',$('input[name=rd'+i+']').is(':checked')); 
    } 
} 

Answer 3

Podałeś nieprawidłowy selektor - # to selektor id.

Połączyć wiele filtrów takich jak ten $(input[name=""][value=""]. Sprawdź poniższy przykład.

$(function() { 
 
    var valu = ['57da17', '57db18', '57db19']; 
 

 
    $('#btn').click(function() { 
 
    for (var i = 0; i < valu.length; i++) { 
 
     $('input[name="rd' + i + '"][value="' + valu[i] + '"]').prop('checked', true); 
 
    } 
 
    }); 
 

 
    $('#vbtn').click(function() { 
 
    for (var i = 0; i < valu.length; i++) { 
 
     console.log('checked btn', $('input[name="rd' + i + '"]').is(':checked')); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <input type="radio" name="rd0" value="57db18">Raj 
 
    <input type="radio" name="rd0" value="57da17">Rahul 
 
    <input type="radio" name="rd0" value="57db19">Mona 
 
</div> 
 
<br> 
 
<br> 
 

 
<div> 
 
    <input type="radio" name="rd1" value="57db18">A 
 
    <input type="radio" name="rd1" value="57da17">B 
 
    <input type="radio" name="rd1" value="57db19">C 
 
</div> 
 
<br> 
 
<br> 
 

 
<div> 
 
    <input type="radio" name="rd2" value="57db18">Apple 
 
    <input type="radio" name="rd2" value="57da17">Orange 
 
    <input type="radio" name="rd2" value="57db19">Mango 
 
</div> 
 

 
<span> 
 
    <button type="button" id="btn" name="btn">Set</button> 
 
</span> 
 

 
<span> 
 
    <button type="button" id="vbtn" name="vbtn">Validate</button> 
 
</span>

Answer 4

potwierdzić, że przy-najmniej jeden radiowy powinien być sprawdzany z każdej grupy.

var valu = ['57da17', '57db18', '57db19']; 
 
function setValue(){ 
 
    for(var i=0;i<valu.length;i++){ 
 
    $('input[name=rd'+i+'][value="' + valu[i]+ '"]').prop('checked', true); 
 
    
 
    } 
 
} 
 
function validateRadioButtonValue(){ 
 
    for(var i=0;i<valu.length;i++){ 
 
     if(!$('input[name="rd'+i+'"]').is(":checked")) 
 
     { 
 
     alert("Please select checkbox named "+"rd"+i); 
 
     } 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <input type="radio" name="rd0" value="57db18">Raj 
 
    <input type="radio" name="rd0" value="57da17">Rahul 
 
    <input type="radio" name="rd0" value="57db19">Mona 
 
</div> 
 
<br> 
 
<br> 
 
<div> 
 
    <input type="radio" name="rd1" value="57db18">A 
 
    <input type="radio" name="rd1" value="57da17">B 
 
    <input type="radio" name="rd1" value="57db19">C 
 
</div> 
 
<br> 
 
<br> 
 
<div> 
 
    <input type="radio" name="rd2" value="57db18">Apple 
 
    <input type="radio" name="rd2" value="57da17">Orange 
 
    <input type="radio" name="rd2" value="57db19">Mango 
 
</div> 
 
    <span> 
 
     <button type="button" id="btn" name="btn" onclick="setValue()">Set</button> 
 
    </span> 
 
    <span> 
 
     <button type="button" id="vbtn" name="vbtn" onclick="validateRadioButtonValue()">Validate</button> 
 
    </span>