Tutorialspoint.dev

HTML | required Attribute

It is a Boolean attribute which is used to specify that the input element must be filled out before submitting the Form.

Elements: This attributes can be associated with three elements which are listed below:

  • <input>: The required attributes can be use in <input> elements.

    Syntax:

    <input required>

    Example:



    <!DOCTYPE html>
    <html>
        <head>
            <title>required Attribute</title>
            <style>
                h1, h2 {
                    color:green;
                    font-style:italic;
                }
                body {
                    text-align:center;
                }
            </style>
        </head>
        <body>
            <h1>GeeksForGeeks</h1>
            <h2>required attribute in input Field</h2>
            <form action="">
                Username: <input type="text" name="usrname" required><br>
                Password: <input type="password"name="password"><br>
                <input type="submit">
            </form>
        </body>
    </html>                    

    Output:

  • <select>: This elements can also use required attributes.

    Syntax:

    <select required>

    Example:

    <!DOCTYPE html>
    <html>
        <head>
            <title>required Attribute</title>
            <style>
                h1, h2 {
                    color:green;
                    font-style:italic;
                }
                body {
                    text-align:center;
                }
            </style>
        </head>
        <body>
            <h1>GeeksForGeeks</h1>
            <h2>required attribute in select Field</h2>
            <form action="">
                <select required>
                    <option value="">None</option>
                    <option value="Santro">Data Structure</option>
                    <option value="Swift">Algorithm</option>
                    <option value="Baleno">Operating System</option>
                    <option value="Scorpio">Computer Network</option>
                </select>
                <input type="submit">
            </form>
        </body>
    </html>                    

    Output:

  • <textarea>: This elements can also use required attributes.

    Syntax:

    <textarea required>

    Example:

    <!DOCTYPE html>
    <html>
        <head>
            <title>required Attribute</title>
            <style>
                h1, h2 {
                    color:green;
                    font-style:italic;
                }
                body {
                    text-align:center;
                }
            </style>
        </head>
        <body>
            <h1>GeeksForGeeks</h1>
            <h2>required attribute in Textarea Field</h2>
            <form action="">
                <textarea rows="7" cols="50" name="comment" required>
                </textarea>
                <input type="submit">
            </form>
        </body>
    </html>                    

    Output:

Supported Browsers: The browser supported by required attribute are listed below:

  • Google Chrome 5.0+
  • Firefox 4+
  • Opera 9.7+
  • Internet Explorer 11.0+


This article is attributed to GeeksforGeeks.org

leave a comment

code

0 Comments

load comments

Subscribe to Our Newsletter