Fehler beim Überprüfen des Optionsfelds nach Wert und Validierung mit Javascript/Jquery

Question

Ich brauche eine Hilfe. Ich muss Radioknopf gemäß Wert überprüfen, indem ich die Identifikation nehme und jene validiere, die Javascript/Jquery verwenden. Ich erkläre meinen Code unten. Hier

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

ich habe 3 Satz von Radiobutton und wenn der Benutzer auf set Taste sollte das Optionsfeld überprüfen gemäß bestimmten Wert in einer Schleife klicken wird. Der Scripting-Teil ist unten angegeben.

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')); 
    } 
} 

aber in diesem aktuellen Fall ist es nicht .Wenn Benutzer geschieht klickt auch auf validate Taste, sollte es alle Radio-Button aktiviert ist oder not.Please mir helfen, zu überprüfen.

Answer 1

Versuchen Sie folgendes:

$('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

Sie wählen das Radio btns nach ID (mit "#"), während sie keine ID haben. Sie sollten sie nach Namen auswählen.

Mit jQuery Namen wählen ist so etwas wie dieses:

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

Sie haben einen ungültigen Selektor angegeben - # ist id Selektor.

Kombinieren Sie mehrere Filter wie diese $(input[name=""][value=""]. Überprüfen Sie das folgende Beispiel.

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

Validate dass zumindest eine-Funk sollte von jeder Gruppe überprüft werden.

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>