title: jQuery POST rows of form data
body: <p>I'm trying to add a simple cart system to my photo gallery, at the moment I'm creating a simple way of updating the selected products with types and quantities. However I have struck a problem with processing the data on PHP end.</p>
  
  <p>Because I'm sending rows with the same field names PHP is overwriting the data to only create 1 array. Ideally I would like it to become this in PHP;</p>
  
  <pre><code>array(item, product, quantity), 
  array(item, product, quantity), 
  array(item, product, quantity)
  </code></pre>
  
  <p>What would be the best way of handling this.</p>
  
  <ol>
  <li>Create the field names with some sort of unique identifier, then get PHP to reprocess the post array.</li>
  <li>Create the arrays with JS then send them as a row as an array so in my case 3 arrays. Not sure if it will work as it will be converted back to string during POST?</li>
  <li>Some way of creating the post arrays with the key being "item_gallery_id" field?</li>
  <li>I have been stuck on this for hours and for something I thought would be simple, I have tried everything :(</li>
  </ol>
  
  <p>POST Parameters</p>
  
  <pre><code>cart_id 1
  item_gallery_id 6
  item_gallery_id 3
  item_gallery_id4
  product_options 12
  product_options 12
  product_options 12
  quantity    1
  quantity    1
  quantity    1
  </code></pre>
  
  <p>I have the following HTML</p>
  
  <pre><code>&lt;form id="order_photo_form"&gt;
  &lt;table width="100%" border="0"&gt;
    &lt;thead&gt;
      &lt;tr&gt;
        &lt;th&gt;Item&lt;/th&gt;
        &lt;th&gt;Album/Item&lt;/th&gt;
        &lt;th&gt;Product/Price&lt;/th&gt;
        &lt;th&gt;Quantity&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
      &lt;tr&gt;
        &lt;input class="form_data" name="item_gallery_id" value="6" type="hidden"&gt;
        &lt;td&gt;&lt;img src="img" width="100"&gt;&lt;/td&gt;
        &lt;td&gt;Item&lt;/td&gt;
        &lt;td&gt;&lt;select class="form_data" name="product_options"&gt;
            &lt;option value="12"&gt;Canvas 100x150cm - $550&lt;/option&gt;
            &lt;option value="11"&gt;Canvas 100x100cm - $350&lt;/option&gt;
          &lt;/select&gt;&lt;/td&gt;
        &lt;td&gt;&lt;select class="form_data" name="quantity"&gt;
            &lt;option value="1"&gt;1&lt;/option&gt;
            &lt;option value="2"&gt;2&lt;/option&gt;
            &lt;option value="3"&gt;3&lt;/option&gt;
            &lt;option value="4"&gt;4&lt;/option&gt;
            &lt;option value="5"&gt;5&lt;/option&gt;
          &lt;/select&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;input class="form_data" name="item_gallery_id" value="3" type="hidden"&gt;
        &lt;td&gt;&lt;img src="img" width="100"&gt;&lt;/td&gt;
        &lt;td&gt;Item&lt;/td&gt;
        &lt;td&gt;&lt;select class="form_data" name="product_options"&gt;
            &lt;option value="12"&gt;Canvas 100x150cm - $550&lt;/option&gt;
            &lt;option value="11"&gt;Canvas 100x100cm - $350&lt;/option&gt;
      &lt;/select&gt;&lt;/td&gt;
        &lt;td&gt;&lt;select class="form_data" name="quantity"&gt;
            &lt;option value="1"&gt;1&lt;/option&gt;
            &lt;option value="2"&gt;2&lt;/option&gt;
            &lt;option value="3"&gt;3&lt;/option&gt;
            &lt;option value="4"&gt;4&lt;/option&gt;
            &lt;option value="5"&gt;5&lt;/option&gt;
          &lt;/select&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;input class="form_data" name="item_gallery_id" value="4" type="hidden"&gt;
        &lt;td&gt;&lt;img src="img" width="100"&gt;&lt;/td&gt;
        &lt;td&gt;Item&lt;/td&gt;
        &lt;td&gt;&lt;select class="form_data" name="product_options"&gt;
            &lt;option value="12"&gt;Canvas 100x150cm - $550&lt;/option&gt;
            &lt;option value="11"&gt;Canvas 100x100cm - $350&lt;/option&gt;
          &lt;/select&gt;&lt;/td&gt;
        &lt;td&gt;&lt;select class="form_data" name="quantity"&gt;
            &lt;option value="1"&gt;1&lt;/option&gt;
            &lt;option value="2"&gt;2&lt;/option&gt;
            &lt;option value="3"&gt;3&lt;/option&gt;
            &lt;option value="4"&gt;4&lt;/option&gt;
            &lt;option value="5"&gt;5&lt;/option&gt;
          &lt;/select&gt;&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Then some simple jQuery;</p>
  
  <pre><code>$.ajax({
     url: "ajax.php?update_cart",
     type: "POST",
     data: $('#order_photo_form').serialize(),
        success: function(data){
           $.jGrowl(data, { life: 10000 });                           
        },
  });
  </code></pre>
  
  <p>Thanks.</p>