Page 1 of 1

Welcome to checkbox POSTing heaven

Posted: Tue Jul 01, 2003 8:35 am
by Heavy
As most of us know. Browsers don't send checkboxes when they are not checked, at form submission time.
I wrote a JS workaround for this. It works at least with IE 6 and MZ 1.4.
Try this script, call it whatever.php, and manipulate the value parameters of the checkboxes.

Code: Select all

<?php
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
?>
<html>
	<head>
	<SCRIPT language="JavaScript1.3">
		
		// Note: Does not work with Netscape 4
		
		function processChecksOnSubmit()&#123;
			var ArrChk = document.getElementsByTagName('INPUT')
			for (var a = 0 ; a < ArrChk.length ; a++ )&#123;
				if (ArrChk.item(a).type == 'checkbox')&#123;
					createHidden(ArrChk.item(a).value,ArrChk.item(a).checked ? 'on' : 'off')
				&#125;
			&#125;
		&#125;
		function createHidden(idx,val)&#123;
			hidden = document.createElement('input')
			
			hidden.type='text' // change to 'hidden'...
			
			hidden.name='HdnArrChk&#1111;' + idx + ']'
			hidden.value=val
			document.forms&#1111;0].appendChild(hidden)
		&#125;
	</SCRIPT>
	<style>
	body &#123;font-family:verdana;font-size:8pt;&#125;
	</style>
	</head>
	<body>
		<FORM method="POST" onsubmit="processChecksOnSubmit()" id="form1" action="<?php echo basename($_SERVER&#1111;'SCRIPT_NAME'])?>">
			<input type="button" value="Ape"  onclick="" name="apeBtn"><br>
			<INPUT type="checkbox" name="ArrChk&#1111;]" value="10" ><INPUT type="checkbox" name="ArrChk&#1111;]" value="10" ><br>
			<INPUT type="checkbox" name="ArrChk&#1111;]" value="20" ><INPUT type="checkbox" name="ArrChk&#1111;]" value="20" ><br>
			<input type="text" value="Monkey" name="monkeyText" ><br>
			<INPUT type="checkbox" name="ArrChk&#1111;]" value="30" ><INPUT type="checkbox" name="ArrChk&#1111;]" value="30" ><br>
			<INPUT type="checkbox" name="ArrChk&#1111;]" value="40" ><INPUT type="checkbox" name="ArrChk&#1111;]" value="40" ><br>
			<INPUT type="checkbox" name="ArrChk&#1111;]" value="50" ><INPUT type="checkbox" name="ArrChk&#1111;]" value="50" ><br>
			<INPUT type="submit" value="submit">
			<br>
			This piece of JavaScript helps when POSTing checkboxes.<br>
			On submit, an array of hidden elements is created. It holds a representation of the checkboxes. <br>
			If a checkbox is checked, the hidden field gets the value 'on'. If not, it gets 'off'.<br>
			The index of the array is the same as the value of the checkbox.<br>
			If you leave the value of a checkbox empty, its corresponding hidden-field in the array is indexed with "&#1111;]" which <br>
			makes the PHP-array index increment in the same way as when using checkboxes with names like <i>name="CheckArray&#1111;]"</i>.
			<hr>
			<h4>Posting results:</h4>
			<table width=50%>
				<tr>
					<td valign="top" width="50%">
						<h5>ArrChk:</h5>
						<?php
						echo '<pre style="background:#eee;height:100%">';
						print_r($_POST&#1111;'ArrChk']);
						echo "</pre>";
						?>
					</td>
					<td valign="top" width="50%">
						<h5>HdnArrChk:</h5>
						<?php
						echo '<pre style="background:#eee;height:100%">';
						print_r($_POST&#1111;'HdnArrChk']);
						echo "</pre>";
						?>
					</td>
				</tr>
			</table>
		</form>
	</body>
</html>
Let me know if there are bugs in it (expect for that it doesn't work with NS4).
Tell me If you like it.

Posted: Tue Jul 01, 2003 8:41 am
by twigletmac
I've moved this to Client Side as it is a JavaScript solution.

Mac

Posted: Tue Jul 01, 2003 8:47 am
by Heavy
Yeah, but it is very much PHP involved with the problem.
It's OK. I'll try to remember the reason why you moved it.

Posted: Tue Jul 01, 2003 8:51 am
by twigletmac
I'm not sure about this as a solution - isn't it easier to assume that if a checkbox is not checked then it's value will not be sent and design forms and form handling accordingly rather than rely on something clientside which is just as subject to differences in browser implementations?

Mac

Posted: Tue Jul 01, 2003 9:17 am
by Heavy
You may be right, it is not a perfect way of doing it.
I was thinking yesterday about making some abstraction wrapper around the $_POST['ChkBoxArr'] but ended up doing tricks with JS instead.