如果表单验证失败,请不要提交表单

时间:2013-04-22 20:16:11

标签: php javascript dom

我写了

<form action='test.php' method='post'>
.............
<submit onclick='validate();'></submit>
</form>

function valiadte(){
  if(true){
      var form = getElementByID(........);
      form.submit();
  }
  else alert('error');
}

但如果失败,它会转到test.php。 我如何避免它去test.php如果失败或我可以传递一些消息到test.php?

提前谢谢。

原始源代码:

            <form id="tabS" method="post" action="stdRegister.php">
                    <label>Account</label>
                    <input id="stdAccount" name="account" type="text" value="" class="input-xlarge" onblur="validateAccountAndID(this,document.getElementById('stdAccountHelp'));">
                    <span class="help-block" id="stdAccountHelp"></span>
                    <label>Password</label>
                    <input id="stdPassword" name="password" type="password" value="" class="input-xlarge" onblur="validatePassword(this,document.getElementById('stdPasswordHelp'));">
                    <span class="help-block" id="stdPasswordHelp"></span>
                    <label>Name</label>
                    <input id="stdName" name="name" type="text" value="" class="input-xlarge" onblur="validateName(this,document.getElementById('stdNameHelp'));">
                    <span class="help-block" id="stdNameHelp"></span>
                    <label>IDNumber</label>
                    <input id="stdID" name="idNumber" type="text" value="" class="input-xlarge" onblur="validateAccountAndID(this,document.getElementById('stdIDHelp'));">
                    <span class="help-block" id="stdIDHelp"></span>
                    <label>Department</label>
                    <select id="stdDepartment" name="department">
                        <?php
                            while ($row = $result->fetch_assoc()){
                                    echo"<option>";
                                    echo $row['department'];
                                    echo"</option>";
                        }
                        ?>
                    </select>
                    <label>Grade</label>
                    <select id="stdGrade" name="grade">
                        <option>1</option>
                        <option>2</option>
                        <option>3</option>
                        <option>4</option>
                    </select>
                    <div>
                        <button class="btn btn-primary" onclick="submitStudetForm();">Create Account</button>
                    </div>
                    <span class="help-block" id="stdRegisterHelp"></span>
                </form>

function submitStudentForm(){
    var form = document.getElementById('tabP');
    if(
        validateAccountAndID(document.getElementById('stdAccount'),document.getElementById('stdAccountHelp')) 
        && validatePassword(document.getElementById('stdPassword'),document.getElementById('stdPasswordHelp')) 
        && validateName(document.getElementById('stdName'),document.getElementById('stdNameHelp')) 
        && validateAccountAndID(document.getElementById('stdID'),document.getElementById('stdIDHelp')) ){
       form.submit();
       alert("success");
    }
    else {
        alert("Something wrong in the form. Please check again!");
        return false;
        //window.location.href='index.php';
    }
}

2 个答案:

答案 0 :(得分:2)

只需在return false案例中使用else函数。

function validate(){
  if(true){
      return true;
  }
  else {
       alert('error');
      return false;
  }
}

您可以将html更改为:

<input type="submit" value="Submit" onsubmit="validate()">

答案 1 :(得分:1)

使用它来停止表单提交:

else {
  alert('error');
  return false;
}

顺便说一下,你的函数名是“valiadte”而不是“validate”。