What is the use of target attribute in HTML form tag?

Question

While I was implementing a file upload progress bar in PHP, I saw this target attribute in form tag. The code was like this:

<form action="<?php echo $_SERVER["PHP_SELF"]; ?>" 
      method="POST" id="myForm" 
      enctype="multipart/form-data" 
      target="hidden_iframe">

What is the use of this target attribute here?

Actually, after submitting this form data (file) we track the upload progress from another page say upload.php. Could we implement this without the target attribute?

Answer 1

That is used to specify in which window you would like to show the response from the remote server upon submitting your form.

Possible values are :

• _blank - new page
• frame - show in the iframe with the given name
• _self - show in the same iframe where the form locates
• _parent - show in the parent page/iframe of the form's iframe
• _top - the top most window

Answer 2

<form action="demo_form.asp" method="get" target="_blank">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="Submit">
</form>

The target attribute specifies a name or a keyword that indicates where to display the response that is received after submitting the form.

The target attribute defines a name of, or keyword for, a browsing context (e.g. tab, window, or inline frame).

Target Attribute Values:

_blank : The response is displayed in a new window or tab

_self : The response is displayed in the same frame (this is default)

_parent : The response is displayed in the parent frame

_top : The response is displayed in the full body of the window

framename : The response is displayed in a named iframe

Now come to your code.

method="POST" id="myForm" enctype="multipart/form-data" target="hidden_iframe"

indicates after posting the myForm the response (resultant page) will be occupied by 'hidden_iframe'.

Answer 3

Works exactly the same way as anchor target. In your case, it looks like there is an iframe somewhere with name="hidden_iframe" - that's where the response from the form will be displayed.

Here is the description of form targets

A name or keyword indicating where to display the response that is received after submitting the form. In HTML 4, this is the name of, or a keyword for, a frame. In HTML5, it is a name of, or keyword for, a browsing context (for example, tab, window, or inline frame).

Source: <form> - HTML | MDN #target