title: Send multiple forms data on one page with ajax
body: <p>I have multiple forms on one web page. I need that user could post data from any form and this data must send to my email. Now working only 1st form.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form name="sentMessage" id="contactForm" novalidate&gt;
          &lt;div&gt;
          &lt;label&gt;Name&lt;/label&gt;
          &lt;input type="text" placeholder="Name" class="name"&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;label&gt;Email&lt;/label&gt;
          &lt;input type="email" placeholder="Email" class="email"&gt;
      &lt;/div&gt; 
      &lt;div id="success"&gt;&lt;/div&gt;
      &lt;button type="submit"&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
  &lt;hr&gt;
  &lt;form name="sentMessage" id="contactForm" novalidate&gt;
      &lt;div&gt;
          &lt;label&gt;Name&lt;/label&gt;
          &lt;input type="text" placeholder="Name" class="name"&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;label&gt;Email&lt;/label&gt;
          &lt;input type="email" placeholder="Email" class="email"&gt;
      &lt;/div&gt; 
      &lt;div id="success"&gt;&lt;/div&gt;
      &lt;button type="submit"&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
  &lt;hr&gt;
  &lt;form name="sentMessage" id="contactForm" novalidate&gt;
      &lt;div&gt;
          &lt;label&gt;Name&lt;/label&gt;
          &lt;input type="text" placeholder="Name" class="name"&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;label&gt;Email&lt;/label&gt;
          &lt;input type="email" placeholder="Email" class="email"&gt;
      &lt;/div&gt; 
      &lt;div id="success"&gt;&lt;/div&gt;
      &lt;button type="submit"&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>PHP:</p>
  
  <pre><code>&lt;?php   
  $name = $_POST['name'];
  $email = $_POST['email'];
  
  // Create the email and send the message
  $to = 'my@email.com'; 
  $email_subject = "Email from $name";
  $email_body = "     Details:\n\n"."
                      Name: $name\n\n
                      Email: $email\n\n";
  $headers = "Content-type: text/plain; charset=utf-8"; 
  
      mail($to,$email_subject,$email_body,$headers);
  return true;    
  ?&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>$(function() {
  
      $("input").jqBootstrapValidation({
          preventSubmit: true,
          submitError: function($form, event, errors) {
              // additional error messages or events
          },
          submitSuccess: function($form, event) {
              event.preventDefault(); // prevent default submit behaviour
              // get values from FORM
              var name = $("input.name").val();
              var email = $("input.email").val();
              var firstName = name; // For Success/Failure Message
              // Check for white space in name for Success/Fail message
              if (firstName.indexOf(' ') &gt;= 0) {
                  firstName = name.split(' ').slice(0, -1).join(' ');
              }
              $.ajax({
                  url: "././mail/contact.php",
                  type: "POST",
                  data: {
                      name: name,
                      email: email
                  },
                  cache: false,
                  success: function() {
                      // Success message
                      $('#success').html("&lt;div class='alert alert-success'&gt;");
                      $('#success &gt; .alert-success').html("&lt;button type='button' class='close' data-dismiss='alert' aria-hidden='true'&gt;&amp;times;")
                          .append("&lt;/button&gt;");
                      $('#success &gt; .alert-success')
                          .append("&lt;strong&gt;Your message has been sent. &lt;/strong&gt;");
                      $('#success &gt; .alert-success')
                          .append('&lt;/div&gt;');
  
                      //clear all fields
                      $('#contactForm').trigger("reset");
                  },
                  error: function() {
                      // Fail message
                      $('#success').html("&lt;div class='alert alert-danger'&gt;");
                      $('#success &gt; .alert-danger').html("&lt;button type='button' class='close' data-dismiss='alert' aria-hidden='true'&gt;&amp;times;")
                          .append("&lt;/button&gt;");
                      $('#success &gt; .alert-danger').append("&lt;strong&gt;Sorry " + firstName + ", it seems that my mail server is not responding. Please try again later!");
                      $('#success &gt; .alert-danger').append('&lt;/div&gt;');
                      //clear all fields
                      $('#contactForm').trigger("reset");
                  },
              })
          },
          filter: function() {
              return $(this).is(":visible");
          },
      });
  
      $("a[data-toggle=\"tab\"]").click(function(e) {
          e.preventDefault();
          $(this).tab("show");
      });
  });
  
  /*When clicking on Full hide fail/success boxes */
  $('#name').focus(function() {
      $('#success').html('');
  });
  </code></pre>
  
  <p>What should I change? How can I submit all 3 forms?</p>