How can use confirm box to submit the form?

[paladio]

Hi
How can use confirm box to submit the form?

<form action="/action_page.php">
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname" value="John"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname" value="Doe"><br><br>

  <button type="submit" value="Submit">Submit</button>
</form> 

[despecial]

Check this JSFiddle from Stephan: http://jsfiddle.net/StephanWagner/cn4921bf/1/

In short: you add an EventListener to the form and on submit trigger the confirmation dialog via jBox.

[paladio]

Check this JSFiddle from Stephan: http://jsfiddle.net/StephanWagner/cn4921bf/1/

In short: you add an EventListener to the form and on submit trigger the confirmation dialog via jBox.

The code sample sent has a problem and does not work!
I want to widely use conform box for a large number of form elements with different id , I want to be able to use conform box to confirm forms in a more dynamic way.
I don't mean one form element, but many forms in different tables and situation

[despecial]

The solution is written above: add an Eventlistener to your form(s) and trigger the confirmation box.

The JSFiddle shows the idea of the code. A bit of coding yourself is required.

[paladio]

The solution is written above: add an Eventlistener to your form(s) and trigger the confirmation box.

The JSFiddle shows the idea of the code. A bit of coding yourself is required.

My scenario is that by giving a specific class "subForm" to each form, it will give a message before submit, and after confirmation, the form will be submitted in the default form.

[StephanWagner]

The fiddle doesn't work because it loads the assets from an old CDN library.

As @despecial said, you just have to rewrite the code a little bit to use it with multiple form. That would be one way if you like to use ajax: http://jsfiddle.net/wz9mcf36/

Without ajax, change the button from submit to a normal button and handle the submit manually, like so: http://jsfiddle.net/StephanWagner/f4zeu8pw/

[paladio]

The fiddle doesn't work because it loads the assets from an old CDN library.

As @despecial said, you just have to rewrite the code a little bit to use it with multiple form. That would be one way if you like to use ajax: http://jsfiddle.net/wz9mcf36/

Without ajax, change the button from submit to a normal button and handle the submit manually, like so: http://jsfiddle.net/StephanWagner/f4zeu8pw/

Thank you dear for your help, I am not very skilled in javascript but what I want is similar to the code below, actually I want to access the target form that is being submitted in the confirm properties in the jbox object So that I can submit it.

$(document).ready(function () {

  $('.any-form').submit(function(ev) {
    ev.preventDefault();
    
    new jBox('Confirm', {
    confirmButton: 'Yes, Confirm',
    cancelButton: 'Cancel',

    confirm: function() {
	ev.target.submit();
    }
  });
  });

});