Original purpose of input type hidden

Question

I am curious about the original purpose of the  lt input type  hidden  gt  tag   Nowadays it is often used together with JavaScript to store variables in it which are sent to the server and things like that    HTML 2 0 was released in November 1995  containing already the specification for input type  hidden  JavaScript was released March 1996   Therefore  the  lt input type  hidden  gt  existed before JavaScript  so what was its original purpose  I can only imagine of sending a value from the server to the client which is  unchanged  sent back to maintain a kind of a state  Or do I get something wrong in the history of it and  lt input type  hidden  gt  was always supposed to be used together with JavaScript   If possible  please also give references in your answers

User · Accepted Answer

I can only imagine of sending a value from the server to the client which is (unchanged) sent back to maintain a kind of a state.

Precisely. In fact, it's still being used for this purpose today because HTTP as we know it today is still, at least fundamentally, a stateless protocol.

This use case was actually first described in HTML 3.2 (I'm surprised HTML 2.0 didn't include such a description):

type=hidden
These fields should not be rendered and provide a means for servers to store state information with a form. This will be passed back to the server when the form is submitted, using the name/value pair defined by the corresponding attributes. This is a work around for the statelessness of HTTP. Another approach is to use HTTP "Cookies".
<input type=hidden name=customerid value="c2415-345-8563">

While it's worth mentioning that HTML 3.2 became a W3C Recommendation only after JavaScript's initial release, it's safe to assume that hidden fields have pretty much always served the same purpose.

User · Answer

I ll provide a simple Server Side Real World Example here  say if the records are looped and each record has a form with a delete button and you need to delete a specific record  so here comes the hidden field in action  else you won t get the reference of the record to be deleted in this case  it will be id  For example   lt  php     if isset   POST  delete action               mysqli query  connection   DELETE FROM table name                                     WHERE record id       POST  row to be deleted                                          Here is where hidden field value is used            while condition      gt       lt span gt  lt  php echo  Looped Record Name     gt       lt form method  post  gt           lt input type  hidden  name  row to be deleted  value   lt  php echo  record id    gt     gt           lt input type  submit  name  delete action    gt       lt  form gt   lt  php         gt

User · Answer

basically hidden fields will be more useful and advantages to use with multi step form  we can use hidden fields to pass one step information to next step using hidden and keep it forwarding till the end step    CSRF tokens    Cross-site request forgery is a very common website vulnerability  Requiring a secret  user-specific token in all form submissions will prevent CSRF attacks since attack sites cannot guess what the proper token is and any form submissions they perform on the behalf of the user will always fail    Save state in multi-page forms    If you need to store what step in a multi-page form the user is currently on  use hidden input fields  The user doesn t need to see this information  so hide it in a hidden input field   General rule  Use the field to store anything that the user doesn t need to see  but that you want to send to the server on form submission

User · Answer

In short  the original purpose was to make a field which will be submitted with form s submit  Sometimes  there were need to store some information in hidden field for example  id of user  and submit it with form s submit   From HTML September 22  1995 specification     An INPUT element with  TYPE HIDDEN  represents a hidden field The user   does not interact with this field  instead  the VALUE attribute   specifies the value of the field  The NAME and VALUE attributes are   required

User · Answer

The values of form elements including type  hidden  are submitted to the server when the form is posted  input type  hidden  values are not visible in the page  Maintaining User IDs in hidden fields  for example  is one of the many uses    SO uses a hidden field for the upvote click     lt input value  16293741  name  postId  type  hidden  gt    Using this value  the server-side script can store the upvote

[javascript] Original purpose of <input type="hidden">?

Examples related to javascript

Examples related to html

Examples related to history