eKini: Web Developer Blog

PHP, MySQL, Javascript, MVC, Zend Framework, AJAX, jQuery

Handling HTML Checkboxes. Execute something when checked/unchecked.

November23

In some cases, you are required to do something (EG: show/hide divs) when a checkbox is clicked. Here is an example using jQuery.

First your checkbox will look like this:

...html code here...

< input name="myCheckBox" id="myCheckBox" value="yes" type="checkbox" /> This is a sample checkbox.

Then somewhere in your HTML head, your Javascript code will look like this:

  1.  
  2. other code here…
  3.  
  4.     $(‘#myCheckBox’).click(function(){
  5.         if (this.checked) {      //this.checked is NOT from jquery
  6.             alert(‘Do any action here.’);
  7.         } else {
  8.             alert(‘Undo the action here.’);
  9.         }
  10.     });
  11.  
  12. other code here…

NOTE: Do not forget to download and then include the required jQuery files in your HTML File.

posted under General

Email will not be published

Website example

Your Comment: