Open In App

HTML | DOM Input FileUpload name Property

Improve
Improve
Like Article
Like
Save
Share
Report

The name property is used to set or return the value of the name attribute of a file upload button. The name attribute is used to identify form data after the submission to the server. 

Syntax:

  • Return the name property:
fileuploadObject.name
  • Set the name property:
fileuploadObject.name=name

Property Values:

  • name: Specifies the name of the file upload button.

Return Value: It returns a string that represents file upload button name. 

Examples-1: Return “name” property. 

HTML




<!DOCTYPE html>
<html>
<head>
    <style>
        h1 {
            color: green;
        }
    </style>
</head>
<body>
  <center>
    <h1>
          Geeks for Geeks
      </h1>
    <input type="file"
           id="myFile"
           name="gfgFile">
    <p id="demo"></p>
    <button onclick="myFunction()">
        Click
    </button>
    <script>
        function myFunction() {
            var x =
                document.getElementById("myFile").name;
            document.getElementById("demo").innerHTML = x;
        }
    </script>
  </center>
</body>
</html>


Output: 

Before:

  

After: 

 

Examples-2: Set “name” property. 

HTML




<!DOCTYPE html>
<html>
<head>
    <style>
        h1 {
            color: green;
        }
    </style>
</head>
<body>
    <center>
    <h1>
          Geeks for Geeks
      </h1>
        <input type="file"
               id="myFile">
        <p id="demo"></p>
        <button onclick="myFunction()">
            Try it
        </button>
        <script>
            function myFunction() {
                var x =
                    document.getElementById(
                        "myFile").name = "new name";
 
                document.getElementById("demo").innerHTML = x;
            }
        </script>
    </center>
</body>
</html>


Output: 

Before:

  

After: 

 

Supported Browsers:

  • Google Chrome 1+
  • Mozilla Firefox 1+
  • Edge 12+
  • Opera 11+
  • Apple Safari 1+


Last Updated : 29 Aug, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads