Posted
Filed under jquery

Usage of Jquery is comparatively simple for input type text, button, file, reset etc. because these controls generally hold data but not state like on and off. Check box and radio buttons are two controls which are generally used for state data like option is on/off, one is selected from a group of options etc.

Using jquery is little but different here because you have to use little more that just ID selectors:

Check Box:

 
<input type="checkbox" name="chkBox" id="chkBox"></input>
 

Handling click and Change Events :

 
/* Using Name for selector */
$("input[@name='chkBox']").click(function(){
   // your code here 
});
 
/* Using ID for selector */
$("#chkBox").change(function(){
   // your code here 
});
 

Radio Button:

 
<input type="radio" name="rdio" value="a" checked="checked" />
<input type="radio" name="rdio" value="b" />
<input type="radio" name="rdio" value="c" />
 

Handling change event for Radio buttons:
Click event can be handled similarly. ID can not be used here because Radio buttons are used for single selection from a group where all input fields of group should have same name.

 
$("input[@name='rdio']").change(function(){
    if ($("input[@name='rdio']:checked").val() == 'a')
        // Code for handling value 'a'
    else if ($("input[@name='rdio']:checked").val() == 'b')
        // Code for handling value 'b'
    else
        // Code for handling 'c'
});

[원문] - http://www.techiegyan.com/2008/07/09/using-jquery-check-boxes-and-radio-buttons/
2011/03/12 08:14 2011/03/12 08:14

blog.visualp.com