Add a row and select dropdown with JS into php page

[fj1200]

I'm re-writing some of our PHP/MySQL-driven dispatching app cos the way we send out products is changing.  I now need to add multiple products onto one advice note whereas before they went out on one truck each and was easy.  I have a small js section on the advice note form that inserts rows, and that works.  Sort-of.  The problem is with the innerHTML part and adding the formatting of the cells which is controlled by css with <td id="input">.  How do I get the new cells to match the existing row formatting? 

 

The table row has <input> tags in each cell except the first cell which has a drop-down <select>.  This is pulled of our live production database and just lists the current jobs.  it has a query:

 

echo   "<td><select name=JOBNAME>";
		while($nt=mssql_fetch_array($result3))
		{
		echo "<option     value='".$SITE_ID.".".$nt['JOB_NAME'].".".$nt['JOB_DESCRIPTION'].".".$JOBTYPE."'>".$nt['JOB_DESCRIPTION']."</option>";
		}
echo	"</select>";

 

How can I embed that into the JS?  I've tried putting it between <? ?> tags but it didn't work.  I'm not familiar with JS so this is all new to me.  I then need to add all the all the data in the new rows into a MySQL database and use that to print the advice note.  Still got  a lot of work to do on the back end, but I want to get this working first.

 

It runs as linked page in Sharepoint and the guys that use it in our loading bay ore not the greatest with computers, so I need to make it as easy as possible for them.  And I have no other resources except me.  And I'm not a programmer or developer. 

 

I've scoured the web, spent time trying it on my own with limited success, but now confused.

[fj1200]

Done some more digging: This almost gives me what I need:

 

			function insRow()
		{
		var mytable=document.getElementById("advicenote")
		for (var i=0; i<1; i++){ //add 3 new rows with content to the end of a table
		var newrow=advicenote.insertRow(-1) //add new row to end of table

		var newcell=newrow.insertCell(0) //insert new cell to row
		newcell.innerHTML='<SELECT name="JOBNAME"><?php
				while($nt=mssql_fetch_array($result3))
				{
				echo "<option value='".$SITE_ID.".".$nt['JOB_NAME'].".".$nt['JOB_DESCRIPTION'].".".$JOBTYPE.\"'>".$nt['JOB_DESCRIPTION']."</option>";
				} ?></select>';

		var newcell=newrow.insertCell(1) //insert new cell to row
		newcell.innerHTML='<input name=\"depot_edition">';
		var newcell=newrow.insertCell(2) //insert new cell to row
		newcell.innerHTML='<input name=\"copies_bundle\">';
		var newcell=newrow.insertCell(3) //insert new cell to row
		newcell.innerHTML='<input name=\"bundles_std\">';
		var newcell=newrow.insertCell(4) //insert new cell to row
		newcell.innerHTML='<input name=\"bundles_odds\">';
		var newcell=newrow.insertCell(5) //insert new cell to row
		newcell.innerHTML='<input name=\"pallet_count\">';
		}
		}
	</script>

 

But it's just the first <select> not being populated that's missing now.  Is it because it's not running the query at page load for the JS items since they are loaded later and on demand?  Any way round that? 

 

I need to then enter all this into our database.  If I view the page source though, the new input fields don't show up.  Also, if the fields have the same name how do I cycle through them to build a db insert?  Not done this before, new territory so a little confused but getting there.