JAVA BY RAMAKRISHNA: 08/13/13

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>

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>