title: Submitting form data through ajax not working
body: <p>sorry for the dumb question but I can't seem to get this going and I figured I best give you more info than not enough -</p>
  
  <p>I have a form that I am running inside a loop in php like this:</p>
  
  <pre><code>&lt;form name="primaryTagForm'.$post-&gt;ID.'" id="primaryTagForm'.$post-&gt;ID.'" method="POST" enctype="multipart/form-data" &gt;
    &lt;fieldset class="tags"&gt;
        &lt;label for="post_tags'.$post-&gt;ID.'"&gt;Tags:&lt;/label&gt;
        &lt;input type="text" value="" tabindex="35" name="postTags'.$post-&gt;ID.'" id="postTags'.$post-&gt;ID.'" /&gt;
    &lt;/fieldset&gt;
  
    &lt;fieldset&gt;
        &lt;input type="hidden" name="submitted" id="submitted" value="true" /&gt;
        '.wp_nonce_field( 'post_nonce', 'post_nonce_field' ).'
        &lt;button class="button" type="submit"&gt;Tag&lt;/button&gt;
    &lt;/fieldset&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>I have tried adding my ajax under that form (Still within the loop so I can grab the post_id) and in my console it my tag-ajax.php file is posted just fine.  Here is my weak attempt at that based on this: <a href="https://stackoverflow.com/questions/15308017/save-data-through-ajax-jquery-post-with-form-submit">Save data through ajax jQuery post with form submit</a> and other like questions.</p>
  
  <pre><code>&lt;script&gt;
  jQuery(document).ready(function($) {
      $(".button").click(function(e) {
          e.preventDefault();
      $.ajax({
          type: "POST",
          url: "'.get_stylesheet_directory_uri().'/tags-ajax.php",
          data: "primaryTagForm'.$post-&gt;ID.'",
          success:  function(data){
              //alert("---"+data);
              alert("Tags have been updated successfully.");
          }
      });
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>And lastly here is what is in my tags-ajax.php file - </p>
  
  <pre><code>if(isset($_POST['submitted']) &amp;&amp; isset($_POST['post_nonce_field']) &amp;&amp; wp_verify_nonce($_POST['post_nonce_field'], 'post_nonce')) {
  
          wp_set_object_terms( $post-&gt;ID, explode( ',', $_POST['postTags'.$post-&gt;ID] ), 'product_tag', true );
  
          echo'Success!';
  }
  </code></pre>
  
  <p>So when I try running this a couple of things happen by looking in the console, if I hit submit on one of the forms then all them forms on that page post to tags-ajax.php (Im sure it is because I am doing this in a loop but not sure how else to do it and bring in post->ID on tags-ajax.php) </p>
  
  <p>The second, most important thing is that nothing actually saves, I click the "Tag" but (submit) and I get those success alerts (for each post unfortunately) but when I click through those the tags are not actually saved.</p>
  
  <p><strong>My question:</strong> How do I get the data to actually save with the ajax/php and how can I have that post refresh without reloading the page so the user sees they actually were added?</p>
  
  <p><strong>Latest Update: After making the serialize edits mentioned below I submit my form and check the console and see the post method is getting a 500 internal server error.. Im thinking if my problem is coming from because I have the form and an inline script with the ajax running in a loop?  So there are technically 20 posts/forms/inline scripts on a page and when you submit one, all of them submit which may be causing the 500 internal error?</strong></p>