The problem with multiple checkboxes
(Have I mentioned that I HATE the TinyMCE implementation in WordPress… I appologize if you came to this post after I edited it changing one letter which allowed TinyMCE to totally scramble it!)
While creating the entry form for the WordPress 2.0 Theme database, I had to learn a bunch of stuff.
First I’d only every created two forms before and one of them only had one field, but I was very proud of it. 🙂
See:
http://forums.the-wildwest.com/checkip.php
It uses the first of several form submission techniques: GET
You can tell a GET form because when you hit submit, you go to a page with a new url followed by a question mark and a bunch of values seperated by ampersands. Since it is a GET, and I didn’t know enough then, it was vulnerable to some of the methods used to attack servers. For instance, I could inject HTML into the url and have it processed in the form like this:
http://forums.the-wildwest.com/checkip.php?ip=I%20should%20not%20be%20able%20to%20put%20HTML%20here
The result was that when I displayed the value for $ip, the HTML code that I put in that value would have been executed. In my simple example the text would have been displayed in bold. NO WHERE in the form should the text I put in there be bold. But it was. I SHOULD have strip all html tags out of my values before displaying them, but I didn’t know any better then. AND bigger and better people than me have made that same mistake. In fact, many of the problems in the WordPress release were at least somewhat related to this technique.
The fix was simple I took the code:
[PHP]
if (!(isset($ip))){
$ip = $_SERVER[‘REMOTE_ADDR’];
}
[/PHP]
and changed it to
[php]
if (!(isset($ip))){
$ip = $_SERVER[‘REMOTE_ADDR’];
}
else {
$ip = htmlspecialchars($ip);
}[/php]
That way, if the variable was blank, I filled it in. If the variable included html, I cleaned it up so that it would not execute. Well, that’s enough of a hacking lesson for now. I will post more ways to protecting your in a different post later. Back to creating forms…
As always W3 Schools has some of the best information about forms and you can see how the GET method can be used to retrieve information from the user in a bunch of different ways. http://www.w3schools.com/html/html_forms.asp
In my Theme submission form, I ask for about 20 different fields to be (optionally) filled in including a description field that could be up to 200 characters long. EVERY submission would likely produce an url that was too long for the Browser to handle. So, using the GET method was right out. I was on new ground.
The method of submitting information I would have to use is the POST method. It sends the information to the server in the array variable $HTTP_POST_VARS. Then you must use PHP or PERL or CGI or whatever to process it. (BTW any method is subject to the HTML injection, so I must parse it too. It is just more when obvious using GET.)
However as it turned out, the POST method seemed to work differently than GET when filling out multiple check boxes and that was something I REALLY wanted to do. My end goal was to take mutiple check boxes and turn them into a binary bitmapped field. That’s an integer value that when looked at in binary represents all of the checked boxes. So the value of 1010101 means that every other check box is checked. And that would be stored in a database integer field as the integer 85.
See, I’m lazy. I could easily make a form with 20 different checkboxes each having a seperate field in the database. But if I’m going to go to the effort of creating a table that stores descriptions of things submitted to my website, I’m going to make it generic and reuse it for all sorts of things. So not only will this be a table for storing theme information, but it will also store the information for the pictures of knitting projects from my wife’s book for here www.knitchat.com website. It will also store pictures of Kits sent down to Missisipi for the Katrina relief project at www.PurlsOfHope.com. Who knows what else I’ll use it for…
Anyway, to create multi-selectible checkboxes, you just put a bunch of checkboxes with the same name (again go to w3schools for the basics of fields).
My sample code worked as desired if I used a Get method to display the result of multiple check boxes.
See here: http://www.Thecodecave.com/MultipleXBox_Get.php
See all of those values in the address bar? There are a bunch of them for the flag check boxes. that’s what I wanted.
However, if I use a Post method do submit the form, I only get one value back, the last one, from my multiple check boxes. See: http://www.Thecodecave.com/MultipleXBox.php
I could find no documentation supporting that said multiple check boxes worked differently under the POST method, but they do!!!
Here’s my original code:
[php]
“;
echo “$ Submit = “.$submit.”
“;
if ($submit) {
echo “Here is what was submitted:
“;
if(is_array($HTTP_POST_VARS)) {
reset($HTTP_POST_VARS);
while (list($key, $val) = each($HTTP_POST_VARS)) {
if (is_array($val)) {
while (list($akey,$aval) = each($val)) {
$HTTP_POST_VARS[$key][$akey] = strip_tags($aval);
echo “Array Value: “.$key . “=” . htmlspecialchars($HTTP_POST_VARS[$key][$akey]).”
“;
}
}
else {
$HTTP_POST_VARS[$key] = strip_tags($val);
echo “Val: ” .$key . “=” . htmlspecialchars($HTTP_POST_VARS[$key]).”
“;
}
}
}
}
else {
?>
[/php]
In the end, thanks to the peope over at CodingForums.com, I was able to get it to work. I was missing a simple peice of information. To get Multiple field values to work using a post method, you MUST have them populate an array. How do you do that? Simple: put empty brackets after the field name.
So, I just changed my code like this:
[php]
- f1
- f2
- f3
- f4
- f5
- f6
- f7
- f8
- f9
- f10
[/php]
and it works great!
You can see it in action here: http://www.Thecodecave.com/MultpleXBox_Fix.php
(Have I mentioned that I HATE the TinyMCE implementation in WordPress… I appologize if you came to this post after I edited it changing one letter which allowed TinyMCE to totally scramble it!)
While creating the entry form for the WordPress 2.0 Theme database, I had to learn a bunch of stuff.
First I’d only every created two forms before and one of them only had one field, but I was very proud of it. 🙂
See:
http://forums.the-wildwest.com/checkip.php
It uses the first of several form submission techniques: GET
You can tell a GET form because when you hit submit, you go to a page with a new url followed by a question mark and a bunch of values seperated by ampersands. Since it is a GET, and I didn’t know enough then, it was vulnerable to some of the methods used to attack servers. For instance, I could inject HTML into the url and have it processed in the form like this:
http://forums.the-wildwest.com/checkip.php?ip=I%20should%20not%20be%20able%20to%20put%20HTML%20here
The result was that when I displayed the value for $ip, the HTML code that I put in that value would have been executed. In my simple example the text would have been displayed in bold. NO WHERE in the form should the text I put in there be bold. But it was. I SHOULD have strip all html tags out of my values before displaying them, but I didn’t know any better then. AND bigger and better people than me have made that same mistake. In fact, many of the problems in the WordPress release were at least somewhat related to this technique.
The fix was simple I took the code:
[PHP]
if (!(isset($ip))){
$ip = $_SERVER[‘REMOTE_ADDR’];
}
[/PHP]
and changed it to
[php]
if (!(isset($ip))){
$ip = $_SERVER[‘REMOTE_ADDR’];
}
else {
$ip = htmlspecialchars($ip);
}[/php]
That way, if the variable was blank, I filled it in. If the variable included html, I cleaned it up so that it would not execute. Well, that’s enough of a hacking lesson for now. I will post more ways to protecting your in a different post later. Back to creating forms…
As always W3 Schools has some of the best information about forms and you can see how the GET method can be used to retrieve information from the user in a bunch of different ways. http://www.w3schools.com/html/html_forms.asp
In my Theme submission form, I ask for about 20 different fields to be (optionally) filled in including a description field that could be up to 200 characters long. EVERY submission would likely produce an url that was too long for the Browser to handle. So, using the GET method was right out. I was on new ground.
The method of submitting information I would have to use is the POST method. It sends the information to the server in the array variable $HTTP_POST_VARS. Then you must use PHP or PERL or CGI or whatever to process it. (BTW any method is subject to the HTML injection, so I must parse it too. It is just more when obvious using GET.)
However as it turned out, the POST method seemed to work differently than GET when filling out multiple check boxes and that was something I REALLY wanted to do. My end goal was to take mutiple check boxes and turn them into a binary bitmapped field. That’s an integer value that when looked at in binary represents all of the checked boxes. So the value of 1010101 means that every other check box is checked. And that would be stored in a database integer field as the integer 85.
See, I’m lazy. I could easily make a form with 20 different checkboxes each having a seperate field in the database. But if I’m going to go to the effort of creating a table that stores descriptions of things submitted to my website, I’m going to make it generic and reuse it for all sorts of things. So not only will this be a table for storing theme information, but it will also store the information for the pictures of knitting projects from my wife’s book for here www.knitchat.com website. It will also store pictures of Kits sent down to Missisipi for the Katrina relief project at www.PurlsOfHope.com. Who knows what else I’ll use it for…
Anyway, to create multi-selectible checkboxes, you just put a bunch of checkboxes with the same name (again go to w3schools for the basics of fields).
My sample code worked as desired if I used a Get method to display the result of multiple check boxes.
See here: http://www.Thecodecave.com/MultipleXBox_Get.php
See all of those values in the address bar? There are a bunch of them for the flag check boxes. that’s what I wanted.
However, if I use a Post method do submit the form, I only get one value back, the last one, from my multiple check boxes. See: http://www.Thecodecave.com/MultipleXBox.php
I could find no documentation supporting that said multiple check boxes worked differently under the POST method, but they do!!!
Here’s my original code:
[php]
“;
echo “$ Submit = “.$submit.”
“;
if ($submit) {
echo “Here is what was submitted:
“;
if(is_array($HTTP_POST_VARS)) {
reset($HTTP_POST_VARS);
while (list($key, $val) = each($HTTP_POST_VARS)) {
if (is_array($val)) {
while (list($akey,$aval) = each($val)) {
$HTTP_POST_VARS[$key][$akey] = strip_tags($aval);
echo “Array Value: “.$key . “=” . htmlspecialchars($HTTP_POST_VARS[$key][$akey]).”
“;
}
}
else {
$HTTP_POST_VARS[$key] = strip_tags($val);
echo “Val: ” .$key . “=” . htmlspecialchars($HTTP_POST_VARS[$key]).”
“;
}
}
}
}
else {
?>
Submission
[/php]
In the end, thanks to the peope over at CodingForums.com, I was able to get it to work. I was missing a simple peice of information. To get Multiple field values to work using a post method, you MUST have them populate an array. How do you do that? Simple: put empty brackets after the field name.
So, I just changed my code like this:
[php]
- f1
- f2
- f3
- f4
- f5
- f6
- f7
- f8
- f9
- f10
[/php]
and it works great!
You can see it in action here: http://www.Thecodecave.com/MultpleXBox_Fix.php