- Created on Tuesday, 22 March 2011 01:51
- Last Updated on Saturday, 14 December 2013 10:44
- Written by Terrence
- Hits: 5846
We will start with the mark up
The .attr() method is used for setting the attributes of the selected element(s).
The .is() method checks the selected element(s) with a selector and returns true if the any of the selected elements match with the selector; otherwise it returns false.
The $(#checkall).is(:checked) part of the preceding statement checks if the checkbox ofÂ id:checkall is checked. If the checkbox (id: checkall) is checked, the .is() method will return true; otherwise it will return false.
If the .is() method returns true, all the input elements of type:checkbox (that is, all the checkboxes) are set to checked mode; all of them will be set to unchecked mode if the .is() method returns false.
Since the user is allowed to check any individual check box, we check the status of each checkbox that has an index value greater than 0 (because the checkbox with index value 0Â is the Check All checkbox).
The value of all the checkboxes is added to the amt variable. To display the bill, we create a paragraph element and add the text Your bill is amt (where amt is the numerical valueÂ contained in the amt variable), and insert this paragraph element after the div element of index value 5; that is, after the last checkbox.