0

I have a form that has two buttons. One to edit a specific candidate after the information has been submitted, another button to just submit and add another candidate. Since there are two buttons on the screen, I need to know which one was clicked so that I can escort the user down the right path.

I am using the jQuery Validation Plugin to help me validate the form before posting it. To prevent users from double clicking the button and submitting a duplicate candidate, I am disabling the button and changing the button to "Submitting" as demonstrated here:

/* This will change the button only if the form has passed and change the button to submitting and disable it */
    submitHandler: function(form) {
            $('#saveandadd').click(function() {
                $('#saveandadd').val('Submitting...');
                $('saveandadd', this).attr('disabled', 'disabled');
                form.submit();
            });
            $('#saveandedit').click(function() {
                $("input[name='setvalue']").val('1'); 
                $('#saveandedit').val('Submitting...');
                $('saveandedit', this).attr('disabled', 'disabled');
                form.submit();

So far this is nice as I can change the button that was clicked to submitting. However, I have noticed a strange problem. Either button requires two clicks to submit it.

I have setup a fiddle here: Form Validation that requires the first and last name to be filled in. You will be prompted as an error if those fields are not filled in.

Thanks in advance

weggie
  • 427
  • 1
  • 10
  • 26
  • 1
    You shouldn't bind another `click` handler inside the `submitHandler`. Just disable the buttons immediately. – Barmar Oct 29 '15 at 16:25
  • @Barmar The problem with that is, that removing the events I can't tell which button is clicked. Right now, if you click the saveandedit button I set a value to a hidden field. I look for that value when the page is processing. If I find it I know they are wanting to saveandedit vs just adding. Any suggestions on how I would be able to keep that and know which button is pressed? – weggie Oct 29 '15 at 16:31
  • 1
    The submit handler gets called when the user clicks one of the submit button. It's supposed to submit the form. But your submit handler isn't submitting the form, it's just adding another click handler to the buttons, and when you click on them again they call `form.submit()`. – Barmar Oct 29 '15 at 16:34
  • As Barmar explained, you can't put a `click` handler within the `submitHandler`... it makes no sense. – Sparky Oct 29 '15 at 16:50
  • @Sparky Thanks for your comments and I understand now what the click handler is doing and why it's not submitting the form. The only thing I would ask is, by removing the click event, I can't tell which button was clicked. Do you have any suggestions as to how I would differentiate between the two buttons? I'm more than open to changing this so that it works properly. I'm just trying to figure out how to tell the difference and set a direction for page processing depending on which button was clicked?. Thanks for your time. – weggie Oct 29 '15 at 17:32
  • Did you look at the accepted answer in the duplicate? – Sparky Oct 29 '15 at 17:34
  • @Sparky Sorry, I didn't even see the link at the top of the page. I'm reading that and testing now. Sorry about that. – weggie Oct 29 '15 at 17:46

0 Answers0