Hidden HTML Field: Using Correctly In Your Code

Disclosure: Your support helps keep the site running! We earn a referral fee for some of the services we recommend on this page. Learn more
Value of
How To Define Input Type In HTML (All The Values And Attributes)
What does Hidden HTML Field: Using Correctly In Your Code do?
Defines a field within a form that is not visible to the user.

Code Example

<form action="myform.cgi">
<input type="file" name="fileupload" value="fileupload" id="fileupload">
<label for="fileupload"> Select a file to upload</label>
<input type="hidden" id="ipaddr" name="ipaddr" value="<?php echo $_SERVER['REMOTE_ADDR']; ?>">
<input type="hidden" id="referer" name="referer" value="<?php echo $_SERVER['HTTP_REFERER']; ?>">
<input type="submit" value="submit">
</form>

The hidden value of type defines a form field that is never displayed to the user. The user cannot change the value of the field, or interact with it.

When the user submits the form, all of the data they have entered is sent, including the data stored invisibly in the hidden fields.

Why Hide a Field?

hidden fields are used programatically, to pass information about the current page to the server.

For example, if a user fills out an enquiry form, we may want to obtain their IP address using a snippet of PHP. We may also want to grab the URL of the referring page. You can see this in action in our code sample; the form captures the information, but does not display it.

Hidden fields allow us to send all kinds of information along with a form message, without the user having to be involved in the process. Hidden fields can also be used to pass information back to scripts. This may include security tokens, or the name of the relevant row in the database. The user does not need to see this data, but it is passed back to the server on submission so that scripts function correctly behind the scenes.

Claire is seasoned technical writer, editor, and HTML enthusiast. She writes for HTML.com and runs a content agency, Red Robot Media.

Browser Support for hidden

iefirefoxchromeedgesafariopera
AllAllAllAllAllAll