jQuery(或只是JS)从onSubmit函数中的多个表单提交按钮中选择

时间:2012-03-31 18:27:51

标签: javascript jquery html forms

我有一个有多个提交按钮的表单。一个用于更改数据库中的数据,一个用于添加,一个用于删除。它看起来像这样:

<form action="addform.php" method="post" id="addform" onSubmit="return validate(this)">
<select name="listings" id="listings" size="1" onChange="javascript:updateForm()">
<!-- Here I have a php code that produces the listing menu based on a database query-->
</select>
<br />
Price: <input type="text" name="price" id="price" value="0"/><br />
Remarks:    <textarea name="remarks" wrap="soft" id="remarks"></textarea><br />
<input type="submit" value="Update Database Listing" name="upbtn" id="upbtn" disabled="disabled"/>
<input type="submit" value="Delete Database Listing" name="delbtn" id="delbtn" disabled="disabled"/>
<br />
<input type="submit" value="Add Listing to Database" name="dbbtn" id="dbbtn"/>
<input type="button" value="Update Craigslist Output" name="clbtn" id="clbtn" onClick="javascript:updatePreview();"/>
</form>

表单中实际上有更多元素,但这并不重要。我想知道的是,对于我的验证方法,我该如何查看单击了哪个提交按钮?

我希望它能够执行以下操作:

    function validate(form){
      if (the 'add new listing' or 'update listing' button was clicked'){
        var valid = "Are you sure the following information is correct?" + '\\n';
        valid += "\\nPrice: $";
        valid += form.price.value;
        valid += "\\nRemarks: ";
        valid += form.remarks.value;
        return confirm(valid);}
      else {
                    return confirm("are you sure you want to delete that listing");
      }
    }

我认为必须有一些方法可以相对容易地做到这一点吗?

5 个答案:

答案 0 :(得分:2)

为什么不设置一个全局变量来指定上次单击哪个按钮?然后,您可以在validate方法中检查此变量。类似的东西:

var clicked;

$("#upbtn").click(function() {clicked = 'update'});
// $("#delbtn").click(function() {clicked = 'delete'});
// ... 

function validate(form) {
    switch(clicked) {
    case 'update':
        break;
            // more cases here ...
    }
}

答案 1 :(得分:1)

例如,您可以将click事件附加到每个提交按钮,该按钮将在变量中保存指向它的指针或使用特定属性/类标记它(在这种情况下,您必须从其他所有项目中删除该标记在事件处理程序中提交按钮,然后在提交回调中,您将知道单击了哪一个

答案 2 :(得分:0)

我认为在每个按钮上使用点击事件并单独处理它会更容易。

$(function() {
    $('input[name=someName]').click(someFunc);
});

function someFunc() {
    // Your validation code here
    // return false if you want to stop the form submission
}

答案 3 :(得分:0)

您可以在表单上有一个隐藏字段,并在单击该按钮时设置该字段的值,然后在验证例程中将其选中。您可以使用jquery来实现此目的,如果您需要示例,请告诉我。

答案 4 :(得分:0)

您可以使用jQuery提交ajax,您可以尝试这样的事情:

$('form#addform input[type="submit"]').on('click',function(e){
        e.preventDefault();
        var current = $(this); //You got here the current clicked button
        var form = current.parents('form');

        $.ajax({
            url:form.attr('action'),
            type:form.attr('method'),
            data:form.serialize(),
            success:function(resp){
                //Do crazy stuff here
            }
        });
});