View All Attachments for Bug 151506

Attachment #68845
HTML testcase	text/html	2006-02-16 14:42:54 UTC	1.70 KB	no flags	Details

<html>
<!--
 http://www.w3.org/TR/html4/interact/scripts.html
 The onchange event occurs when a control loses the input focus and its value has been modified since gaining focus.
//-->
<body>
    <script language="JavaScript">
    <!--
	/**
	 * Function called when C All changes by "onchange"
	 */
	function ChangeAll () {
	    if (document.getElementById('c_all').checked) {
		alert('Checked all');
		document.getElementById('c_1').checked = true;
		document.getElementById('c_2').checked = true;
		document.getElementById('c_3').checked = true;
	    } else {
		alert('Unchecked all');
		document.getElementById('c_1').checked = false;
		document.getElementById('c_2').checked = false;
		document.getElementById('c_3').checked = false;
	    }
	}
	
	/**
	 * Function called when one of C1, C2 or C3 changes by "onchange"
	 */
	function CheckboxChanged (id) {
	    alert('Checkbox changed by clicking: '+ id)
	    if (document.getElementById('c_1').checked && document.getElementById('c_2').checked && document.getElementById('c_3').checked) {
		document.getElementById('c_all').checked = true;
	    } else {
		document.getElementById('c_all').checked = false;
	    }
	}
    //-->
    </script>

    <form name='onchange_test'>
    <h3>Test for checkbox-onChange</h3>
    <h4>Check Box for All</h4>
    <input type="checkbox" id="c_all" name="c_all" onchange="ChangeAll();"> C All -> C 1 + C 2 + C 3<br />
    <h4>Check Boxes</h4>
    <input type="checkbox" id="c_1" name="c_1" onchange="CheckboxChanged('c_1');"> C 1<br />
    <input type="checkbox" id="c_2" name="c_2" onchange="CheckboxChanged('c_2');"> C 2<br />
    <input type="checkbox" id="c_3" name="c_2" onchange="CheckboxChanged('c_3');"> C 2<br />
    </form>
</body>
</html>