How to call a confirm function before submitting a form only on click of one submit button not on the other submit button present?

Question

I've a following form layout:

<form action="newsletter.php" name="newsletter" id="newsletter" method="post">
  <input type="submit" value="Submit" class="c-btn" id="submit_value" name="submit_value">
  <input type="submit" value="Send" class="c-btn" id="send_value" name="send_value">
</form>

On clicking of a button titled Send an jQuery alert should come asking for "Are you sure to send the mail?".

If user clicks on Yes then the form shoud get submit and if user clicks on No then the form should not get submit.

When user clicks on the submit button with value Submit then this alert should not come and the form should submit normally.

How can I do this ?

Answer 1

<form action="newsletter.php" name="newsletter" id="newsletter" method="post">
  <input type="submit" value="Submit" class="c-btn" id="submit_value" name="submit_value" onclick="return confirm('Are you sure to send the mail?');">
  <input type="submit" value="Send" class="c-btn" id="send_value" name="send_value">
</form>

Check here

Answer 2

use like this as you want to show the confirmation only on click the send button use onclick instead on onSubmit in send button

    <form action="newsletter.php" name="newsletter" id="newsletter" method="post">
      <input type="submit" value="Submit" class="c-btn" id="submit_value" name="submit_value">
      <input type="submit" value="Send" class="c-btn" id="submit_value" name="submit_value" onclick="if(!confirm('Are you sure to send the mail?')){return false;}">
   </form>

Answer 3

javascript confirm function returning boolean , so you can add it inside input where you want to confirm action

return confirm('are you sure ?');

to be like this

<form action="newsletter.php" name="newsletter" id="newsletter" method="post" onsubmit="">
  <input type="submit" value="Submit" class="c-btn" id="submit_value" name="submit_value">
  <input type="submit" value="Send" class="c-btn" id="send_value" name="send_value" onclick="return confirm('are you sure ?');">
</form>