How to handle only visible fields in HTML form?
Depending on the structure of your form, this may be a viable method to remove the name
hidden inputs attribute . in whatever Javascript you use to hide the input add this line:
myInputElement.removeAttribute('name');
Unnamed inputs are not submitted with the form. If you might need to go back (and show the inputs again), you might consider storing the name, which can be recovered: perhaps use the same name
as id
for each element, or store it in the element class
.
The best idea as suggested by Colin would be to disable the element. This will have the same effect as removing his name, however it would be much easier to return if you need to.
myInputElement.disabled = true;
a source to share
My recollection is that the disabled input will not be submitted in the form data. So when you hide the field, set the disabled attribute as well. There is no need to guess names and identifiers.
From W3C:
In this example, the INPUT element is disabled. Hence it cannot accept user input and its value will not be submitted with the form.
<INPUT disabled name = "fred" value = "stone">
a source to share
You can do this (using jQuery as an example) using the: visible selector to see which form elements are visible, and then either serialize the visible ones to the form, submit it, or remove the invisible ones.
http://docs.jquery.com/Selectors/visible http://docs.jquery.com/Selectors
http://docs.jquery.com/Ajax/serialize http://docs.jquery.com/Ajax
However, it would be much easier for you to make the form elements empty when they become invisible, and then make them optional on the server side.
EDIT I can't imagine PHP not handling these unless you post it one way or another. Anything that has a name will be processed, except for checkboxes that are indicated by a missing value. As far as I know PHP is unable to indicate what the visible status of the field was on the client side when the form was submitted.
Perhaps you could add the disabled / invisible field names to an extra hidden field, comma concatenation or whatever, and build PHP to not handle the fields that appear in it. Otherwise, you can manipulate the field names to start with proc_ and noproc_ or whatever, and use that as an instruction on whether to process that field, but again you're just passing additional PHP instructions.
a source to share
I'm not sure if you can do this without making at least some Javascript changes.
Since the fields are hidden in the browser (possibly using CSS), there is no way for the PHP script that receives the form to find out which ones are hidden (it fails to get the current state of the CSS) if javascript doesn't help.
I would recommend, as suggested earlier, get javascript to remove the name attribute so no fields are sent.
a source to share
PHP has no way to tell if an HTML form has been hidden. The only ways are: A) Detaching the name with JS
The problem with this is that you want to re-include the form element where you lost the name, and you must have a way to save it in order to replace it.
B) Adding an extra hidden field stating that the field is hidden (with JS repetition) This will add more data to the HTTP POST, which could be considered a disadvantage. Also, you need PHP to check if the "fieldHidden" $ _POST var is set.
An example of this would be to create a hidden element named "HiddenFields [hiddenFieldName]" and then use if array_key_exists with the name of the post variable you are checking.
It's kind of convulated, but will still allow PHP to access the variable if you so desire.
C) setting the read-only field. (again, with JS) I think this will work. But then PHP doesn't have access to it, which could be a problem.
a source to share