How to add innerText column, set array and insert into MySQL?

[Techissue2008]

I created input fields to add multiple rows of data with js.

I need to create a batchid which is the sum of all productname.

How can I insert the row data one by one into DB?

How should I set those variables as array and loop them into DB?

Here is the code:

<script language="javascript">
function add(){
var table = document.getElementById("table1");
var row = table.insertRow();
var im = row.insertCell();
im.innerHTML = "<img src=\"http://localhost/images/" + document.getElementById("productname").value + ".jpg\">"
var pn = row.insertCell();
pn.innerText = document.getElementById("productname").value;
var q = row.insertCell();
q.innerText = document.getElementById("quantity").value;
var p = row.insertCell();
p.innerText = document.getElementById("price").value;
var total = row.insertCell();
total.innerText = document.getElementById("price").value * document.getElementById("quantity").value;
var r = row.insertCell();
var button = document.createElement("input");
button.type = "button";
button.value = "Remove";
button.onclick=function(){document.getElementById("table1").deleteRow(row.rowIndex)}
r.appendChild(button);
}
</script>

<?php
 if(isset($_POST['submit']))
 {
        $product           = trim($_POST['productname']);
	$qty               = trim($_POST['quantity']);
	$price             = trim($_POST['price']);
	$batchid           = trim($_POST['batchid']);
	$image             = trim($_POST['image']);
	$total             = trim($_POST['total']);

	$query = "INSERT INTO productupdate (batchid, image, productname, quantity, price, total, entrydate) VALUES ('$batchid', '$image', '$product', '$qty', '$price', '$total', curdate());";
	mysql_query($query) or die('Error, query failed. ' . mysql_error());
	header('Location: ' . $_SERVER['REQUEST_URI']);
	ob_end_flush();
	exit();
}else{
	header('Location: ' . $_SERVER['REQUEST_URI']);
	ob_end_flush();
	exit();
}
?>

//Add multiple rows
Product Name<input type="text" id="productname" name="productname" size=20 />
QTY<input type="text" id="quantity" name="quantity" size=10 />
Price<input type="text" id="price" name="price" size=10 />
<input type="button" value="Add"onclick="return add();" />

<table id="table1" border="1">
<tr><td>Image</td><td>ProductName</td><td>QTY</td><td>Price</td><td>Total</td><td>Function</td></tr>
</table>

// How to set array to add multiple rows of productname, qty, price, image, total? 
<?php
$batchid = document.getElementById("productname").value;
$image = "http://localhost/images/" + document.getElementById("productname").value + ".jpg\"
?>

<input type="submit" name="submit" value="Submit" id="submit">

[devinemke]

a simple example:

<form action="" method="post">

#1<br>
name: <input type="text" name="products[1][name]">
qty: <input type="text" name="products[1][qty]">
price: <input type="text" id="price" name="products[1][price]">

<br><br>

#2<br>
name: <input type="text" name="products[2][name]">
qty: <input type="text" name="products[2][qty]">
price: <input type="text" id="price" name="products[2][price]">

<br><br>

#3<br>
name: <input type="text" name="products[3][name]">
qty: <input type="text" name="products[3][qty]">
price: <input type="text" id="price" name="products[3][price]">

<br><br>

<input type="submit" name="submit" value="submit">
</form>

<?php
if (isset($_POST['submit']))
{
	foreach ($_POST['products'] as $value)
	{
		extract($value);
		$sql = "INSERT INTO table SET name = '$name', qty = '$qty', price = '$price'";
		echo $sql . '<br>';
	}
}
?>