Cara Validasi radio button array dengan Jquery

Posted in Javascript Jquery Life at 12 Maret 2021 With 0 Comments

Bagaimana Cara Membuat Validasi Input Type Radio dalam data array? Contoh kasus dapat kita lihat dalam quiz atau quisionaire.... validasi ini dilakukan agar semua pertanyaan dari soal yang ada dijawab oleh user.

validasi radio dengan jquery

Oleh karena itu , kita membuat validasi radio dimana tentuny data nya di tampilkan atau di ambil dari database

Berikut contoh Script nya

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#radioValidate').click(function(){
var check = true;
$("input:radio").each(function(){
var name = $(this).attr("name");
if($("input:radio[name="+name+"]:checked").length == 0){
check = false;
}
});

if(check){
$("#myForm").submit(); // Submit the form
}else{
alert('Harap Di Isi Semua !!.');
}
});
});
</script>
<h1>Pertanyaan</h1>
<form name="form1" method="post" id="myForm" action="jawab.php" >
<input type="radio" name="ques1" value="1" />Option 1
<input type="radio" name="ques1" value="2" />Option 2 <h1>Question 2</h1>
<input type="radio" name="ques2" value="1" />Option 1
<input type="radio" name="ques2" value="2" />Option 2 <h1>Question 3</h1>
<input type="radio" name="ques3" value="1" />Option 1
<input type="radio" name="ques3" value="2" />Option 2<input type="button" id="radioValidate" value="Validate"/>
</form>

 Contoh 2


<h3>Validasi Radio Button array PHP MYSQli
<br>Suckittrees.com</h3>


1. <input type="radio" value="a" name="questions[0]">Pilihan 1
<input type="radio" value="b" name="questions[0]"> Pilihan 2
<br />
2. <input type="radio" value="a" name="questions[1]"> Pilihan 1
<input type="radio" value="b" name="questions[1]"> Pilihan 2
<br />
<button id="test">Proses</button>


<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.js"></script>
<script type="text/javascript">
var rgroups = [];
$('input:radio').each(function(index, el) {
var i;
for (i = 0; i < rgroups.length; i++)
if (rgroups[i] == $(el).attr('name')) return true;
rgroups.push($(el).attr('name'));
});
rgroups = rgroups.length;

$('#test').click(function() {
if ($('input:radio:checked').length < rgroups) alert('Harap diisi semua.');
else alert("You're done!");
});

</script>

Demo Download

Artikel Rekomendasi

Artikel Terkait

Diskusi

wa