Hide form field but not submit in JavaScript

I want to hide the default form fields and show them only in groups depending on the checkbox.

If the user shows some fields, fills them out, but then redefines them using the checkbox, will the data be sent anyway if the fields have something in them or should I clear them using JavaScript?

+4
source share
4 answers

Fields will be sent anyway, but your service receiving the message should just look for the value of this flag and ignore the values โ€‹โ€‹at that point. Either this, or you will need to clear the fields.

+2
source

According to the html specification, a field is sent if it meets the following criteria:

  • It is contained in the form
  • This is the input type, selection, button
  • It contains a nonempty name attribute.
  • If it is set to <input type = "checkbox" or type = "radio" / ">, it should be checked.

Visibility doesnโ€™t matter. There are actually many reasons why something may be invisible, not to mention being off-screen. Some methods, such as honeypot fields, require this.

So, in order to fully answer your question, if some form interaction requires that you submit only what is visible, you can do one of the following:

  • Move the "visible" elements as children of the form (the preferred path), moving them to another parent when they are not visible (after the animation hides them). This should be the easiest, especially if I use jquery. Remember the animation, move the hidden elements around their respective parents, and then live. In addition, hidden elements can be easily manipulated with minimal performance, as the browser does not try to re-display them until they become visible in any case.
  • Clear data (lose user input)
  • Clear the names of the input fields and recreate the names when they are not hidden.

The third method is a bit. I would do the first or second, depending on your specific needs, with the preference given to the first.

+2
source

To keep it short and sweet, use javascript to remove the field. Itโ€™s quick and easy, and you donโ€™t have to expand the server side of the script to determine what happened. If you also want to, save the remote html in the global var, so when they switch the script parameter back. Hope this helps!

+1
source

If the form simply hides behind the scenes, yes, the data will still be sent, despite being hidden. You must empty them through JS.

0
source

All Articles