Hi,
I'm new to PHP, my web experience goes as far as CSS, HTML and working with CMS. I need to get something done in PHP an I'm a total noob in PHP.
Here is what I have to do.
I have a small database for a block order system. Someone orders an amount of blocks (and different block types). The form should calculate how many pallets will be needed depending on the amount of blocks an their type. Then store the data into a table...

Here is what I have so far:
So a table row, shows a block-type, which has a per-pallet amount (how many blocks fit on a pallet), then I want to enter the Quantity of the blocks I want, and it should calculate the amount of pallets needed and the extra blocks left over.

Simple really, but I cannot get it to work.

Code PHP:
<?php
include('db.php')
?>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>HB - Block Order Tracking System</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
<script type="text/javascript">
	function getTotal(idx) {
		var ppidx = 'perpallet'+idx;
		var qidx = 'quantity'+idx;
		var xidx = 'pallets'+idx;
		if (!document.getElementById(pidx)) { return false; }
		if (!document.getElementById(qidx)) { return false; }
		if (!document.getElementById(xidx)) { return false; }
		var p = document.getElementById(pidx).value;
		if ((p == '') || !isNaN(p)) { return false; }
		var q = document.getElementById(qidx).value;
		q = parseInt(q, 10);
		var total = Math.ceil(q / p);
		document.getElementById(xidx).value = total;
	}
</script>
</head>
<body>
<img class="page-bg" src="page-bg.jpg" alt="bg" />
<img class="header-img" src="header-bg.png" alt="header" />
<div id="wrap">
	<form name="fmorder" action="insert-order.php" method="post">
		<table class="styled-table">
			<tr>
				<th>Order Date</th><th>Company Name</th><th>Delivery Date</th>
			</tr>
			<tr>
				<td><input type="text" name="orderdate" value="" /></td>
				<td>
					<?php
						$query = mysql_query("SELECT company_name FROM client_table ORDER BY company_name");
						echo '<select name="users">';
						echo '<option value="" selected="selected"></option>';
						while ($r = mysql_fetch_array($query)) {
							echo '<option value="'.$r['company_name'].'">'.$r['company_name']."</option>";
						}
						echo "</select>";
					?>
				</td>
				<td><input type="text" name="deliverydate" value="" /></td>
			</tr>
		</table>
		<br />
		<div style="float:left;">
		<?php
			$sql = "SELECT * FROM blocks_table WHERE series='100 Series'";
			$result = mysql_query($sql)or die(mysql_error());
			$rowcounter = 0;
			echo '<table class="styled-table">';
			echo '<tr><th>100 Series</th><th>Per Pallet</th><th>Quantity</th><th>Pallets</th><th>Extras</th></tr>';
			while($row = mysql_fetch_array($result)){
				$rowcounter++;
				echo '<tr><td>'.$row['type'].'</td>
				<td><input type="text" name="perpallet'.$rowcounter.'" id="perpallet'.$rowcounter.'" style="width:50px;" value="'.$row['per_pallet'].'" /></td>
				<td><input type="text" name="quantity'.$rowcounter.'" id="quantity'.$rowcounter.'" style="width:50px;" value="" /></td>
				<td><input type="text" name="pallets'.$rowcounter.'" id="pallets'.$rowcounter.'" style="width:50px;" value="" onfocus="getTotal('.$rowcounter.');" /></td>
				<td><input type="text" name="extras" value="" style="width:50px;" /></td>
				</tr>';
			}
			echo '</table>';
		?>
		</div>
</form>
</div>
</body>
</html>

The loop goes through and draws the table fine. But of-course it does not populate the "Pallets" field cause there is nothing in the "Quantity" field. And the onfocus does not work to display the total, since we're out of the loop once the page loads and cannot access the getTotal() function.

I tried using a "calculate" button on every row, to call the getTotal() function, but this triggers the form post which should just input the data in another table.
It also refreshes the page and so everything goes back to blank.
Should be done using javascript?

We have the "Per Pallet", we type in the amount, and we should calculate the pallets needed and the extra blocks left over an populate the other text fields in the row.

The loop that draws the table uses variables for each row. How do I access them later? Outside the loop? So I can use javascript.

I'm kind of lost.
screenshot.png
I've attached a screenshot of my table.

Any help will be greatly appreciated.

thanks