Pass multiple values of same data field through POST - php

Question

I'm trying to pass multiple values from same parameters of a form using POST, but can't figure out how to proceed. I've used bootstrap css such that I can add multiple products. And I want to process the data of multiple orders by passing the values using POST method.
On clicking 'Add another' link, additional set of data field appear which enables recording of multiple transactions of a same user.
The code is as follows:
<div class="col-xs-5 col-lg-offset-3">
<form action="billingProceed.php" method="post" role="form">
<table id="itemElement">
<tr>
<td>
<select class="form-control">
<option class="form-control"> Customer Name</option>
<option class="form-control"> Customer ID</option>
</select>
</td>
<td><input type="text" name="<?php echo $data["name"]; ?>" class="form-control" /></td>
</tr>
<tr>
<td>
<select class="form-control">
<option class="form-control"> Item Name</option>
<option class="form-control"> Item ID</option>
</select>
</td>
<td ><input type="text" name="<?php echo $data["item"]; ?>" class="form-control" /></td>
</tr>
<tr>
<td style="float:right;">Quantity
</td>
<td><input type="text" name="<?php echo $data["quantity"]; ?>" class="form-control" /></td>
</tr>
<tr>
<td style="float:right;">Price
</td>
<td><input type="text" name="<?php echo $data["price"]; ?>" class="form-control" /></td>
</tr>
<tr>
<td style="float:right;">Discount
</td>
<td><input type="text" name="<?php echo $data["discount"]; ?>" class="form-control" /></td>
</tr>
</table>
<input type="submit" value="Proceed" class="btn btn-primary" />
<p style="float:right;">Add another</p>

Answer 1

You can use an array name.
Example:
<input name="data['name'][1]">
<input name="data['name'][2]">

Answer 2

Firstly you should be aware of the name array, for input names.
HTML Example:
<form>
<a id="add_another" href="#">Add Another</a>
<table>
<tr class="product_item">
<td>
<input type="text" name="product[1][name]" value=""/>
</td>
<td>
<input type="text" name="product[1][item]" value=""/>
</td>
</tr>
<tr id="dummy">
<td>
<input type="text" name="product[0][name]" value=""/>
</td>
<td>
<input type="text" name="product[0][item]" value=""/>
</td>
</tr>
</table>
</form>
On POST, in your PHP script, you will access them as follows:
foreach($_POST['product'] as $product)
{
$name = $product['name'];
$item = $product['item'];
}
Shoot for the JS
//You'll always start with one product row.
var productCount = 1;
$('#add_another').click(function() {
var dummyproduct = $('#dummy').clone();
//Increment Product count
productCount += 1;
//Rename all inputs
dummyproduct.find('input[name^="product[0]"]').each(function(){
$(this).attr('name',$(this).attr('name').replace('product[0]','product['+productCount +']'));
});
//Remove Id from cloned dummy
dummyproduct.removeAttr('id').addClass('product_item');
//Insert row before Dummy
dummyproduct.insertBefore('#dummy');
});