Jquery Question posted in
The official Jquery Api Documentation can be found here.

submit 2 form data in single submit using jquery ajax

i want to submit 2 from data in single submit button.

<form id="form1">
  <input type="text" name="name">
  <input type="submit" value="Submit">
</form>

<form id="form2">
  <input type="email" name="email">
  <input type="submit" value="Submit">
</form>

What i use for signle form:

  $.ajax({
    url: '/submit_form_data.php',
    type: 'POST',
    data: $("#form1").serialize();,

    success: function(response) {
      // Handle the response from the server.
    }
  });

please help me so i can pass both form data in signle ajax sunmit.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    i got working solution as :

    $(document).ready(function() {
  // Create a FormData object for each form.
  var formData1 = new FormData($('#form1')[0]);
  var formData2 = new FormData($('#form2')[0]);

  // Append the FormData objects to a single object.
  var formData = new FormData();
  formData.append('formData1', formData1);
  formData.append('formData2', formData2);

  // Make an Ajax request to the server, passing in the FormData object as the data parameter.
  $.ajax({
    url: '/submit_form_data.php',
    type: 'POST',
    data: formData,
    processData: false, // Don't process the data as a query string.
    contentType: false, // Don't set the Content-Type header.
    success: function(response) {
      // Handle the response from the server.
    }
  });
});

  2. 0

    you can concat two formdata, like this:

      $.ajax({
    url: '/submit_form_data.php',
    type: 'POST',
    data: $("#form1").serialize() + '&' + $("#form2").serialize() ,

    success: function(response) {
      // Handle the response from the server.
    }
  });
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search