Tuesday, 13 August 2013

JQuery Check box Example



JQuery Checkbox Example
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function() {

$("#selectedValue").click(function() {
   var values=[];
   $("input:checkbox[name=lang]:checked").each(function() {
      values.push($(this).val());
   });
for(i=0;i<values.length;i++) {
   alert(values[i]);
}
});
$("#selectedText").click(function() {
   var values=[];
   $("input:checkbox[name=lang]:checked").each(function() {
      values.push($(this).prev().text());
   });
for(i=0;i<values.length;i++) {
   alert(values[i]);
}
});
$("#selectedIndex").click(function() {
   var values=[];
   $("input:checkbox[name=lang]:checked").each(function() {
      values.push($(this).index());
   });
for(i=0;i<values.length;i++) {
    alert(values[i]);
}
});
});
</script>
</head>
<body>
<div>
<label for="telugu">Telugu</label>
<input type="checkbox" name="lang" value="telugu"/>
<label for="english">English</label>
<input type="checkbox" name="lang" value="english"/>
<label for="hindi">Hindi</label>
<input type="checkbox" name="lang" value="hindi"/>
</div>
<button id="selectedValue">Selected Value</button>
<button id="selectedText">Selected text</button>
<button id="selectedIndex">Selected index</button>
</body>
</html>