提交单击提交按钮的表单

时间:2016-12-06 11:22:31

标签: javascript forms validation

每当提交一个验证输入的表单并且返回true或false时,都需要调用validation()函数。但基于两个提交按钮,有两个validation()函数。这是一个例子

<form name="abc" id="abc" method="post" onsubmit="return validate()">
    <button type="submit" id="save">Save</button> 
    <button type="submit" id="edit">Edit</button> 
</form>
<script type = "text/javascript">
    document.getElementById("save").onclick = function() {
         validateSave();
    }
    document.getElementById("edit").onclick = function() {
         validateEdit();
    }
    function validateSave(){
          //do validation
    }
    function validateEdit(){
          //do validation
    }
    function validate(){
          //return true or false based on the validation 
    }
</script>

所以基本上我想使用 onsubmit =&#34; return validate()天气导航到下一页或保持在同一页面。那么如何使用 onsubmit =&#34; return validate()以及基于点击按钮的相应验证。

任何线索/提示都将不胜感激。 感谢

2 个答案:

答案 0 :(得分:1)

做这样的事情:

HTML:

<form name="abc" id="abc" method="post">
    <button type="submit" id="save" onclick="validate(event)">Save</button> 
    <button type="submit" id="edit" onclick="validate(event)">Edit</button> 
</form>

JS:

function validateSave(){
      console.log("save");
      return false;
}
function validateEdit(){
      console.log("edit");
      return false;
}
function validate(event){
      event.preventDefault();
      event.stopPropagation();
      var callerId = event.target.id;
      var formElement = document.getElementById("abc");
      if (callerId === "Save") {
            formElement.onsubmit = validateSave(); // Or other value/function
      }
      else {
            formElement.onsubmit = validateEdit(); // Or other value/function
      }
      formElement.submit();
}

答案 1 :(得分:0)

我通过在javascript部分中声明一个标志变量找到了一种方法

<form name="abc" id="abc" method="post" onsubmit="return validate()">
    <button type="submit" id="save">Save</button> 
    <button type="submit" id="edit">Edit</button>  
</form>
<script type = "text/javascript">
     var flag="";
     document.getElementById("save").onclick = function() {
         flag="Save";
     }
     document.getElementById("edit").onclick = function() {
         flag="Edit";
     }
     function validateSave(){
         //do validation
     }
     function validateEdit(){
         //do validation
     }
     function validate(){
         if(flag == "Save"){
             if(validateSave()){
                 return true;
             }
             else{ 
                 return false;
             }
         }
         if(flag == "Edit"){
             if(validateEdit()){
                 return true;
             }
             else{ 
                 return false;
             }
         }             
      }
 </script>