Clever Geek Handbook

JQuery (or just JS) choosing from multiple form submit buttons in onSubmit function

I have a form with multiple submit buttons. One for changing data in the database, one for adding and one for deleting. It looks like this:

<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>

There are actually more elements in the form, but that doesn't matter. What I want to know, for my validation method, how can I check which submit button is clicked?

I want him to do the following:

    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");
      }
    }

I'm guessing there must be some way to make this relatively easy?

+3


source to share


5 answers


Why don't you set a global variable that determines which button was last clicked? Then you can check this variable in your check method. Something like:



var clicked;

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

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


source


You can, for example, attach a click event to each submit button, which will store a pointer to it in a variable, or mark it with a specific attribute / class (in which case, you will have to remove this marker from all others send buttons in your event handler) and then in the opposite call submit you will find out which one was pressed



+1


source


I find it easier to just use the click event on each button and handle it individually.

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

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


source


You can have a hidden field on a form and set the value of that field when the button is clicked, and then raise it up in your validation routine. You can use jquery to achieve this, let me know if you need an example.

0


source


You can use ajax view with jQuery, you can try something like this:

$('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
            }
        });
});
0


source






More articles:


All Articles