How to use two submit button different purpose ajax and form submit

Question

I have two submit button in form, one button for validate and form submit form reload, Another one for submit the form with out validate in ajax method, How to do this.

HTML Code:

<form action="" id="form-product" method="post" name="product" enctype="multipart/form-data">
 <input type="text" name="title"id="title">
 <input type="submit" name="save">  
 <input type="submit" name="enter">
</form>


$(function() {
$("form[name='product']").validate({
rules: {
 title: {
    required: true,

    },

},
messages: {     
title: {
  required: "Please enter your Emailid.",

}, 
},

    submitHandler: function(form) {
      form.submit();
    }
  });
});

Why not have a single button doing the both jobs? When a button is clicked, it validates the form. If there are no errors, it will submit the form. It will show the error otherwise. — Dilip Raj Baral, Jul 31 '17 at 09:22
You dont need 2 submit button. You can add data by ajax and page reload. — Anand Pandey, Jul 31 '17 at 09:23
Duplicate question ? [Two submit buttons in one form](https://stackoverflow.com/questions/547821/two-submit-buttons-in-one-form) — roetnig, Jul 31 '17 at 10:37

Ataur Rahman Munna · Answer 1 · 2017-07-31T09:37:24.653

1

Actually you can do it a numerous way.I will show you one possible way,

<form action="" id="form-product" method="post" name="product" enctype="multipart/form-data">
 <input type="text" name="title"id="title">
 <input type="button" name="save" value="validate" onclick="_validate()">  
 <input type="button" name="submit" onclick="_submit()" value="enter">
</form>

<script>
function _validate(){
    console.log("add your validation method here");
    // add your validation method here.
}
function _submit(){
   console.log("submit your form without validation");
   //just submit your form
}
</script>

edited Jul 31 '17 at 09:37

answered Jul 31 '17 at 09:31

Ataur Rahman Munna

3,887
1
23
34

Two button have a diffents process with out validation just draft another button get process – shanmuga kumar Jul 31 '17 at 09:35
You can use different function for two buttons and handle click event. – Ataur Rahman Munna Jul 31 '17 at 09:38

score 0 · Answer 2 · answered Jul 31 '17 at 09:26

HTML CODE:

     <input type='submit' id='btn1' value='Normal Submit'>
     <input type='button' id='btn2' value='New Window'>

JS CODE:

     document.getElementById('btn2').onclick = function() 
     {
     form.target = '_blank';
     form.submit();
     }

or simply try this:

   <input type='submit' name='self' value='This window' onclick='this.form.target="_self";' />

   <input type='submit' name='blank' value='New window' onclick='this.form.target="_blank";' />

How to use two submit button different purpose ajax and form submit

2 Answers2