All for Joomla All for Webmasters

Let's Play With Coding…

Event Handler for Radio Button Input Type

Hi guys, Today I am back with another tutorial regarding event handler for Radio Button. In usual case with all input types you can perform some functionality based on changes made in input value using onchange¬†function but in radio button it won’t work.

For an example

/**
 * CodeZone.in
 * Author: Dineshkumar
 * Contact : hi@codezone.in
 */
<input type="radio" name="myRadios" onchange="handleChange();" value="1" />
<input type="radio" name="myRadios" onchange="handleChange();" value="2" />

In above case onchange function won’t work. So in that case we use onclick¬†to handle this event. Below is an working example to handle event

/**
 * CodeZone.in
 * Author: Dineshkumar
 * Contact : hi@codezone.in
 */
 <input type="radio" name="myRadios" onclick="handleClick(this);" value="1" />
 <input type="radio" name="myRadios" onclick="handleClick(this);" value="2" />

In above case this parameter is used to pass which value is send to handler function. For an example below java script function can be used to handle this to display which value is selected.

/**
 * CodeZone.in
 * Author: Dineshkumar
 * Contact : hi@codezone.in
 */
 function handleClick(myRadio) {
    alert('Selected value: ' + myRadio.value);
}

In same way you can handle it based on your own logic.

Happy coding…

Related posts

Simple Site Maintenance HTML Page

Hi guys, Today I am back with another tutorial regarding event handler for Radio Button. In usual case with all input types you can perform some

International Calling Codes

Hi guys, Today I am back with another tutorial regarding event handler for Radio Button. In usual case with all input types you can perform some

Load HTML content using jQuery

Hi guys, Today I am back with another tutorial regarding event handler for Radio Button. In usual case with all input types you can perform some

Load Instagram feeds in webpage

Hi guys, Today I am back with another tutorial regarding event handler for Radio Button. In usual case with all input types you can perform some

Leave a Comment

Leave a Reply