user6214813
user6214813

Reputation:

html required not being set

html required is not being set for my inputs. i am submitting the forms using onclick ,not submit input type. the form submits without any content in the input

<form action="ordercomplete.php" method="post">  
    <div id="supercon">  
  
    
    <?php
    $url="ordersummary.php";
    //left arrow to previous page
    echo"<div id=\"leftb\" onclick=\"location.href='".$url."';\" style=\"cursor: pointer;\">";
    echo'<span class="Centerer"></span>';
    echo'<img  class="Centered" src="arrows.png">';
    echo'</div>';

   ?> 
   </div>    
  <!--delivery details -->
    <div id="conphp">
    <p id="centerp">PLEASE ENTER YOUR DETAILS</p>
    <p id="conphpp">
        >Name: <br/>
    <input  type='text' name='name' required/>   
    </p> 

    <P id="conphpp"> 
        >Number:<br/>
    <input  type= "text" name="number" required/>
    <br/></P>
       

    <p id="conphpp">
       >Delivery address:<br/>
    <textarea name="address" rows="7" cols="80" required></textarea>      
    </p>     
       
      
    </div>
 <!--right arrow made to submit the form -->
    <div id="rightb" onClick="javascript:document.forms[0].submit();"  style="cursor: pointer;"><span class="Centerer"></span>
    <img  class="Centered" src="arrows-1.png">
    </div>
</form>

what is the problem here? how to solve this?

Upvotes: 0

Views: 51

Answers (1)

Quentin
Quentin

Reputation: 943571

what is the problem here?

Submitting a form with JavaScript bypasses HTML 5 validation.

how to solve this?

Replace

<div id="rightb" onClick="javascript:document.forms[0].submit();"  style="cursor: pointer;"><span class="Centerer"></span></div>

With:

<button id="rightb"><span class="Centerer"></span></button>

… and any CSS you desire to make it look the way you want.

You should probably put some actual content in it too. I'd imagine that would involve replacing a background image with an <img> that has an alt attribute.

Upvotes: 2

Related Questions