Form placement in a div

I tried to create a form that covers almost all of the content of my page. Since the input field is scattered, it verifies but still proceeds to the next page afterwards. I don't know what the problem is; it works fine in HTML and PHP formats when I try it offline. The problem happens when I upload it to the server.

The script:

<form method="post" action="step.php" id="form1">
<div id="content">
<center>
<br><br><br>
      <input  id="sig" name="sig" type="text" class="validate[sign] text-input" style="margin-left:-180px;visibility:hidden;height:0px;"/>


    <div id="signatureparent">
    <div id="signature"></div>
    </div>
</div>

</center>

<!====================================================================================>




<div id="content">
<div id="wrapper">
<div id="form-div">
<center><strong>Please enter the information for the person who will be the primary contact for our account set up team. If left blank we will use the information in the billing section.</strong></center>
<div id="wrapper3">
<div id="form-div">

<center>
<table cellpadding='0' cellspacing='27'>
<tr>
<td>
<!====================================================================================>
<div style="display:none">
<label for="name"><strong>First Name<font color=red size=3> *</font></strong></label>
      <p class="name">
         <input name="name" readonly="readonly" type="text" class="validate[custom[name]] text-input" id="Name" value="<?php echo $_POST["name"]; ?>" />

      </p>
<label for="last" style="margin-left:45px;"><strong>Last Name<font color=red size=3> *</font></strong></label>
      <p class="last">
         <input name="last" style="margin-left:45px;" readonly="readonly" type="text" class="validate[custom[last]] text-input" id="last" value="<?php echo $_POST["last"]; ?>" />

      </p>
</div>

<!====================================================================================>
<label for="cname"><strong>First Name<font color=red size=3> *</font></strong></label>
      <p class="cname">
         <input name="cname" type="text" class="validate[custom[cname]] text-input" id="cname" value="" />
        </p>

<label for="cemail"><strong>E-mail<font color=red size=3> *</font></strong></label>
      <p class="cemail">
        <input name="cemail" type="text" class="validate[custom[cemail]] text-input" id="cemail" value=""  />

      </p>

<!====================================================================================>
</td><td>

<label for="clast" style="margin-left:45px;"><strong>Last Name<font color=red size=3> *</font></strong></label>
      <p class="clast">
         <input name="clast" style="margin-left:45px;"  type="text" class="validate[custom[clast]] text-input" id="clast" value="" />

      </p>

<label for="cphone" style="margin-left:45px;"><strong>Phone<font color=red size=3> *</font></strong></label>
      <p class="cphone">
        <input type="text" class="validate[custom[mob]] text-input" name="cphone" id="cphone"  style="margin-left:45px;width:100px" /> 

 <b>ext</b><input style="width:25px; margin-left:5px;" type="text" class="validate[custom[ext]] text-input" name="cext1" id="cext1" />
        </p>

</td><td>


<!====================================================================================>   
<label for="ccom" style="margin-left:45px;"><strong>Company<font color=red size=3> *</font></strong></label>
      <p class="com">
        <input type="text" class="validate[custom[ccom]] text-input"name="ccom" id="ccom" onblur="this.value = this.value.toTitleCase();" style="margin-left:45px;" />
      </p>

<label for="cmob" style="margin-left:45px;"><strong>Mobile#</strong></label>
      <p class="mob">
        <input type="text" class="validate[custom[mob]] text-input" name="cmob" id="cmob" style="margin-left:45px;width:100px;" /> 


<b>ext</b><input style="width:25px; margin-left:5px;" type="text" class="validate[custom[ext]] text-input" name="cext2" id="cext2" />
        </p>

</div></div></div></div></div>
</center>
</td></tr></table>

<div>

<!====================================================================================>
<br>
<div id="wrapper">
<div id="form-div">

<table><tr><td><div style="margin-left:210px;" >
<p><font color=red size=2%><b>Clicking this button means that you accept the terms and conditions of our service  </b></font></td><td>
<div id="accept"><button style="margin-left:10px;border: 0; background: transparent" type="submit"><img src=img/acept.png height=30 /></button>
 </div>
</tr></td></table>
</div>
</div>  
<br><br><br>

</form>

It should first verify the contents, then proceed.

Answers


It appears that your form does not run any code on submitting it. You'd want your form to have:

<form method="post" action="step.php" id="form1" onsubmit="return validate()">

This is assuming that your validation code is as a JavaScript function.


Need Your Help

Always get the Unique ID and release it for reuse

java multithreading threadpoolexecutor

ExecutorService service = new ThreadPoolExecutor(10, 10, 1000L,

PHP MySQL - Display saved forms submitted by a specific user

php mysql forms

I'm an up an coming developer trying to develop an online ordering system. Basically users will login to a system, create a form, save a form and display previously saved forms.