How to Determine Which Submit Button Was Pressed, Form Onsubmit Event, Without Jquery

How To Determine Which Submit Button Was Pressed, Form onSubmit Event, Without jQuery

Not in the submit event handler itself, no.

But what you can do is add click handlers to each submit which will inform the submit handler as to which was clicked.

Here's a full example (using jQuery for brevity)

<html>
<head>
  <title>Test Page</title>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript">

  jQuery(function($) {
      var submitActor = null;
      var $form = $('#test');
      var $submitActors = $form.find('input[type=submit]');

      $form.submit(function(event) {
          if (null === submitActor) {
              // If no actor is explicitly clicked, the browser will
              // automatically choose the first in source-order
              // so we do the same here
              submitActor = $submitActors[0];
          }

          console.log(submitActor.name);
          // alert(submitActor.name);

          return false;
      });

      $submitActors.click(function(event) {
          submitActor = this;
      });
  });

  </script>
</head>

<body>

  <form id="test">

    <input type="text" />

    <input type="submit" name="save" value="Save" />
    <input type="submit" name="saveAndAdd" value="Save and add another" />

  </form>

</body>
</html>

Can I determine which Submit button was used in javascript?

You could also use the onclick event in a number of different ways to address the problem.

For instance:

<input type="submit" name="submit" value="Delete" 
       onclick="return TryingToDelete();" />

In the TryingToDelete() function in JavaScript, do what you want, then return false if do not want the delete to proceed.

Determine which element triggered a form submit event

You can use document.activeElement This will work for clicks and when the user tabs to a button and hits the enter button.

Listen for the submit event on the form, then inside of the callback, reference document.activeElement, it will be the button that the user clicked or tabbed to.

Example:
http://codepen.io/anon/pen/KVoJrJ

How to know which submit button fired the onsubmit event

There is a submitter attribute on SubmitEvent object.

See example:

<!DOCTYPE html>
<html>
<body>
<form action="./test.html" onsubmit="myFunction(event)">
  Enter name: <input type="text" name="fname">
  <button id="firstButton" type="submit">Button 1</button>
  <button id="secondButton" type="submit">Button 2</button>
</form>

<script>
function myFunction(event) {
  // This should log id of the button that was used for submition
  console.log(event.submitter.id); 

  // Prevent sending the form (just for testing)
  event.preventDefault();
}
</script>

</body>
</html>

See https://developer.mozilla.org/en-US/docs/Web/API/SubmitEvent/submitter

jQuery: how to get which button was clicked upon form submission?

I asked this same question: How can I get the button that caused the submit from the form submit event?

I ended up coming up with this solution and it worked pretty well:

$(document).ready(function() {
    $("form").submit(function() { 
        var val = $("input[type=submit][clicked=true]").val();
        // DO WORK
    });
    $("form input[type=submit]").click(function() {
        $("input[type=submit]", $(this).parents("form")).removeAttr("clicked");
        $(this).attr("clicked", "true");
    });
});

In your case with multiple forms you may need to tweak this a bit but it should still apply

Which submit button was pressed?

You could use delegate():

$('form').delegate('input:submit','click',
                   function(){
                       alert(this.name);
                       return false;
                   });

JS Fiddle demo.

Edited to address question in the comments, from OP:

Would it be possible to display 0 or 1 as the state of the associated checkbox with this approach?

Yeah, that's possible, though it's a little more long-winded than I'd like:

$('form').delegate('input:submit','click',
                   function(){
                       var idString = this.name;
                       var checkboxState = $('#' + idString).find('input:checkbox').is(':checked');

                       if (checkboxState == true){
                           alert('1');
                       }
                       else {
                           alert('0');
                       }
                       return false;
                   });

JS Fiddle demo.

How to Determine Which Submit Button Was Pressed, Form Onsubmit Event, Without Jquery