How to specify the name of an input element?

Last Updated : 24 Jun, 2024

To add the name of an input element, we use the HTML <input> name attribute. The HTML <input> name attribute is used to specify a name for an <input> element. It is used to reference the form data after submitting the form or to reference the element in JavaScript.

Syntax:

<input name="name">

Attribute Values:

It contains a single value name that describes the name of the <input> element.

Example 1: In this example, define an input element within a form, setting its name attribute to specify its identifier. Surround the input field with a <label> tag, using the for attribute to associate it with the input's id, aiding accessibility and user experience.

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <title>
        How to specify the name of an
        input element using HTML?
    </title>
</head>

<body style="text-align: center;">

    <h3>
        How to specify the name of an
        input element using HTML
    </h3>

    <form id="myGeeks">
        <label for="GFG">Username</label>
        <input type="text" id="GFG" name="GFG">
        <br><br>

        <label for="GFG1">Password</label>
        <input type="password" id="GFG1" name="GFG1">
        <br><br>

        <input type="submit" name="submit">
    </form>
</body>

</html>

Output:

Example 2: The HTML code creates a webpage titled "HTML Input name Attribute" with a centered layout. It includes a form with an input field named "geeks" and a pattern attribute enforcing a specific input format.

HTML

<!DOCTYPE html> 
<html> 

<head> 
    <title> 
        HTML Input name Attribute 
    </title> 
</head> 

<body style="text-align:center;"> 

    <h1>GeeksForGeeks</h1> 

    <h2>HTML Input name Attribute</h2> 
    <form id="myGeeks"> 
        <input type="text"
            id="text_id"
            name="geeks"
            pattern="[A-Za-z]{3}"
            value="Manas Chhabra"> 
    </form> 
    <br> 
</body> 

</html>