I was under the impression that the server code (or at least PHP) that parses the POST of an HTML form cannot distinguish between a POST from a form with a checkbox whose value is not "checked" versus a POST from a form that doesn't include a checkbox by that name at all.
For example, take the following 3 forms. If they were all submitted as is, with no manual entry, just using the inital values, then forms f2 and f3 would send the same results:
<form name="f1">
<input type="text" name="txt_1" value="Hello">
<input type="checkbox" name="chk_1" checked="checked">
</form>
<form name="f2">
<input type="text" name="txt_1" value="Hello">
<input type="checkbox" name="chk_1">
</form>
<form name="f3">
<input type="text" name="txt_1" value="Hello">
</form>
In my real application, I'm submitting forms of the type f3, with a checkbox deliberately omitted (different checkboxes in different situations). For any checkbox I left missing, I wanted the back-end to just ignore it -- don't treat it as On or Off, just do nothing related to that field.
After I built it, I was almost going to throw out my work before testing, when I remembered that the back-end would treat a missing chk_1 exactly like it would an existing chk_1 that was unchecked -- and would turn Off the related value in the back-end.
But I went and tried it out, and IT WORKED! And I tried different variations, and they all work. They correctly disregard the fields related to missing checkboxes (while processing the fields related to existing checkboxes).
So, that's great, but I don't know how it's done (or whether it might stop working -- say on another browser, etc.). In PHP, I know that the code isset($_POST['chk_1']) will get the value of the checkbox, and it returns false in both cases: unchecked checkbox or missing checkbox. Is there a way in other server languages to distinguish? Why is this working?
The short answer is that PHP only gets what the Browser sends it. It doesn’t know or care about the form itself, just the data from the browser. The data comes as a collection of name=data values.
Among other factors, the browser will only send a button if
it has a name, and
it has been selected
If the button has no name, or if it was not selected, then PHP will never hear of it. This applies to
normal buttons (<button> or <input type="submit">)
radio buttons (where only one in a group can be selected: if none is selected, then this, too, will be absent)
checkboxes (only selected checkboxes are sent)
So, the short answer is that PHP will never know whether a checkbox is missing or simply unchecked, because neither will be sent to the server.
Related
I have a form:
<form method="GET">
<input type="text" value="hello" name="myname" />
</form>
If this form is submitted, I will end up at:
example.com/?myname=hello
What I would prefer is that when this gets submitted, I end up at:
example.com/hello
Is this possible?
No, you cannot change the way form submission works in HTML. (Using JavaScript, you can do transactions in a different way, without using HTML form submission.) When using method="GET", the URL gets constructed in a specific way; when using method="POST", the URL does not contain submitted data at all (it is sent outside the URL).
There is a trick that changes form submission in one way, but not quite the way you want. If the name of a control is isindex, then the control name and the equals sign are omitted; but the question mark is still there. That is, <input type="text" value="hello" name="isindex" /> would result in http://www.example.com/?hello. And Chrome has broken this when they removed the remainders of support to the isindex element.
If, for some special reason, you really need to make a form create requests like http://example.com/hello, then the simplest way is to set up a very simple server-side script that accepts normal requests that result from HTML forms and just passes them forward after modifying the URL in a simple way.
I was always confused about what the 'name' attribute did in html forms. From the textbook I read (html and css, design and build webpages by John Duckett), this is what it said about the 'name' attribute.
When users enter information
into a form, the server needs to
know which form control each
piece of data was entered into.
(For example, in a login form, the
server needs to know what has
been entered as the username
and what has been given as the
password.) Therefore, each form
control requires a name attribute.
The value of this attribute
identifies the form control and is
sent along with the information
they enter to the server.
From reading this, I always thought that, say in the database there is a field called "theUsersPasswordField" and a field called "theUsersUsernameField". I thought that, suppose there is a registration form, then the form would be like:
<form action="aURL" method="post">
<p>Please enter what you want your Username to be:</p>
<input type="submit" name="theUsersUsernameField" />
<p>Please enter what you want your Password to be:</p>
<input type="password" name="theUsersPasswordField" />
</form>
and then this way, when the information is sent to the database, it will know which information to put in the 'theUsersPasswordField" and which information to put in the "theUsersUesrnameField". Am I wrong?
What does name="next" mean? I see it often when I look at html forms, for example, here in this Django tutorial I am doing:
<form method="post" action=".">
<p><label for="id_username">Username:</label></p>
<p><label for="id_password">Password:</label></p>
<input type="hidden" name="next" value="/" />
<input type="submit" value="login" />
</form>
In the tutorial I am doing, it says that
The html form contains a submit button and a hidden
field called next. This hidden variable contains a URL that tells the view where to
redirect the user after they have successfully logged in
now, how is 'next' a url? When I run the code, the form does in fact successfully redirect to the main page, but how does it know to redirect to the main page? Why does name='next'?
And how does the server know which information to treat as the username and which information to treat as the password? I though that that is what the 'name' attribute is used for?
The name attribute in a control element like input assigns a name to the control. It has two basic effects: 1) a control needs a name in order to be “successful”, which means that a name=value pair from it will be included into the form data when the form is submitted; and 2) the attribute specifies what will be included as the first part of the name=value pair.
It is entirely up to the server-side form handler what (if anything) it will do with the name=value pairs in the form data. They might have a simple correspondence in some database, but that’s just one possibility. And form handling need not be database-based at all.
The name attribute values have no predefined meaning in HTML. They are just strings selected for use in this context, and they may be descriptive or mnemonic, or they may not.
However, the choice of name attribute values may have side effects. Browsers may give the user a menu of previously entered data so that if you fill e.g. several forms (possibly in different sites) that have a control named email, you might be able to enter your email address just once and then accept whatever the browser suggests as input. This may be seen as a convenience or as a threat to data security. There is proposed set of “standard” names for many purposes in HTML5 CR.
For completeness, it needs to be added that in browser practice and according to HTML5 CR description of name, two names have a special meaning: _charset_ and isindex.
The name next is in no way special, but in this context, it appears to specify the next page to move to. It is defined for a hidden field, so it takes effect independently of user input.
and then this way, when the information is sent to the database, it will know which information to put in the 'theUsersPasswordField" and which information to put in the "theUsersUesrnameField". Am I wrong?
You have to write a script (for example in php) that will put the right values from your form (they are in the $_POST array) into the databse.
in your example $_POST['theUsersUsernameField'] will hold the username
<form method="post" action=".">
<p><label for="id_username">Username:</label></p>
<p><label for="id_password">Password:</label></p>
<input type="hidden" name="next" value="/" />
<input type="submit" value="login" />
</form>
how is 'next' a url?
next is not the url.
the action="." is the url to wich the form redirects.
/ is the value that the script will evaluate to see what it has to do. (Normally you will have to change this into something else like 'check password')
In the $_POST[] array there will be a key $_POST['next'] and the value will be /
I am not familiar with Django but I hope this helps
Is it possible to have a <input type="checkbox"> post 1 when selected and 0 when not selected?
By default, it only POST's something (in Firefox 'on') if it has been selected, nothing when not selected.
Preferably without the use of JavaScript.
I know that in Ruby on Rails the default workaround is to use two inputs like so:
<input type="hidden" name="whatever" value="0" />
<input type="checkbox" name="whatever" value="1" />
That way, if the checkbox isn't checked, the zero value gets sent. But if it is, both values get sent. Rails will deal with this behind the scenes, but if you go this route with a different server backend, you may need to take that into account.
Alternatively, if you like JavaScript, you can use a nameless, valueless checkbox with its "onchange" event bound to something that sets the hidden input's value appropriately.
Hope that's useful!
Long story short: No.
<select> only sends the value of the <option> or <option>s that is/are selected.
Just make sure you have an idea of what the options are going into it, and you'll have it made in the shade.
Edit: To address the updated question:
Same story still short: No.
Only the value (or occasionally content) of "successful" controls are sent.
If a checkbox is not checked, it's not successful, and as such, won't be sent.
Just make sure you have an idea of what the controls are going into it, and you'll have it made in the shade.
Reedit: It's probably possible with JavaScript, by messing with the onSubmit action, and setting the value of the related name to 0 if it's not already set.
At the risk of sounding like your tennis instructor, I do have to inform you that this course of action is neither wise nor advisable.
I'm using some radio buttons to influence the behavior states of a jQuery widget.
That widget can be used in a form but, since these radios don't contain any actual data, I don't want them to submit noise to the server, or cause naming conflict to whoever will use the widget in his form.
Here are two potential solution starts, not yet satisfying though :
remove the name attribute : seems to work fine for other inputs, but turns my radios into checkboxes : it kills the link between them so selecting one doesn't unselect the others. Is there an HTML way (i.e. other than Javascript event) to bind them without a name attribute ?
disable the input : As expected, nothing is submitted, but the radios become grey and can't be clicked. Is there any way that they stay clickable yet unsubmittable, like disabled at submit time ?
As far as possible, I'm rather looking for a cross-browser solution.
Try call a function before submit, that disables the radio buttons.
function disableBtn() {
document.getElementById('idbtn1').setAttribute('disabled', 'disabled');
document.getElementById('idbtn2').setAttribute('disabled', 'disabled');
return true;
}
Then, in form:
<form action="file" method="post" onsubmit="return disableBtn()">
Try this:
<form>
<input type="radio" name="group1" value="1" form="">
<input type="radio" name="group1" value="2" form="">
</form>
This still uses the name attribute which is required for radio buttons, and it also leaves the inputs enabled for interaction. No JavaScript code, no during-submit patching of the document in hope that the submit will turn out fine and destroying the document before submit will leave no visible traces.
The form="" attribute indicates that these input elements are not included in their parent form. Actually you're supposed to put the ID of another existing <form> element in this attribute, but then again, by the HTML standard, you're probably not supposed to exclude radio buttons from a form. So this hack is the only solution to the problem. (Doesn't work in Internet Explorer, but what does today.)
I'm intending to use this method for radio button groups that are in a data table which is populated from a <template> element. In this case, there will be a radio group in each table row, so their number is unknown. But since the name attribute is the only way to build radio button groups, they'll need to get counting names assigned. Since the table data is put in a JSON field before submitting anyway, I don't need field names for a form submit. Radio buttons do need names for themselves, but this method will still exclude them from being submitted.
I went through many online documents for the checkbox input in XHTML. Can anyone clear my doubt? What does this name field actually stand for?
Milk: <input type="checkbox" name="checkbox" value="Milk">
Chocolate: <input type="checkbox" name="checkbox" value="chocolate">
Cold Drink: <input type="checkbox" name="checkbox" value="Cold Drink">
I thought it was an identifier for that particular checkbox, which can later be used in other file by just referring their name, but given that all the checkbox had same name, why even specify it? A little confused of this.
Dont be confused because of name="checkbox". It could more logically be name="drink" and type=checkbox.
In the above case, you have multiple checkboxes with the same name. When several checkboxes have the same name, the form will send a group of values to the server in the request. Note: only the values of the checked checkboxes will be sent to the server.
Ideally these are used to allow multiple choice questions where more than one answer is allowed.
As opposed to radio buttons, where only one answer is allowed among the options.
Update:
On the receiving side, if you're using JSP for example - the values of the selected checkboxes will be available as request.getParameterValues("drink") or request.getParameterValues("checkbox") in your actual case. This is where the name attribute is used.
The name attribute is used to
reference form data after it’s
submitted, and to reference the data
using JavaScript on the client side.
Source: http://reference.sitepoint.com/html/input/name
Basically, what you've described. When the form is submitted, you can access the values of the form elements through the name you ascribe to them.
The only place where you would want to have multiple inputs with the same name is when they are radio buttons, in which case it is used to indicate which one of them belongs to the same group and thus only one of which can be selected at a time.
The name attribute is used to identify a checkbox. Which you could parse into a object like so {checkboxName1: 'checkboxValue2', checkboxName2: 'checkboxValue2'}
You missed the array setting for the name. By using the array setting (using square brackets), the result will be three different indexes for the checkboxes.
Milk: <input type="checkbox" name="checkbox[]" value="Milk">
Chocolate: <input type="checkbox" name="checkbox[]" value="chocolate">
Cold Drink: <input type="checkbox" name="checkbox[]" value="Cold Drink">
the "name" is same with the databse record, every field should have a name, so when you click the submit, the data will recorded to the database~~~~~