Redirecting to a page ONLY IF INPUTS ARE FILLED in HTML-CodePudding

I'm new to coding in HTML. After hours of searching the internet for a way to do this, I failed and so I'm here. I want to redirect user to another page ONLY AFER USER FILLED ALL INPUTS IN THE FORM

but here if user will click submit it will redirect to next page.

<form action="home.php" method="post">
    <div>
        <input type=text name="username">
        <label>Email or phone number</label>
    </div>
    <div>
        <input type=text name="username">
        <label>Phone</label>
    </div>      
    <button type=submit name="submit">Sign In</button>

CodePudding user response：

Use the required attribute. Example below:

<form action="home.php" method="post">
    <div>
        <input type=text name="username" required>
        <label>Email or phone number</label>
    </div>
    <div>
        <input type=text name="username" required>
        <label>Phone</label>
    </div>      
    <button type=submit name="submit">Sign In</button>

You can combine this attribute with other attributes, like pattern, to define a requirement in a more specific input.

At the same time, it is still necessary to check user input on the server.

CodePudding user response：

You should use radio box. For example your html code:

<input type="radio" name="contact" id="contact_email" value="email" />
<label for="contact_email">Email</label>

and now, you can check if it's "checked" with php code below:

if(isset($_POST['contact'])) {

// code to redirect, for example header...

}