Update database from dynamic table

[ndeniche]

Hello peeps.

I'm trying to update a sql table from mi php Ajax web page, which stores dynamically a table into the page by table.appendChild(row) , so that the user can verify the information he is inserting before the actual database update.

How do I do this with ajax?

[ndeniche]

Ok, so I've come up to this:

function guardarProceso(id)
{
	
        //get table
	var table = document.getElementById('candidatos');
	
	var num = table.rows.length - 1;

	//sentinel that checks if php request returned successfully	
	sent = false;
	
	for(i = 0; i < num; )
	{
                //cycle will repeat itself until the xmlhttprequest's variable
                //readystate and status are 4 and 200

                //this validation prevents the script from assigning values to
                //parameters and sending the request over and over
		if(!sent)
		{
			sent = true;

			//Create xmlhttprequest variable
			if (window.XMLHttpRequest)
			{// code for IE7+, Firefox, Chrome, Opera, Safari
			  xmlhttpNew=new XMLHttpRequest();
			}
			else
			{// code for IE6, IE5
			  xmlhttpNew=new ActiveXObject("Microsoft.XMLHTTP");
			}

			//get row data
			row = table.rows[i+1];

                        //parameters for php
			params = "?num=" + id + "&id=" + row.cells[0].innerHTML;
			params += "&nom=" + row.cells[1].innerHTML + "&tel=" + row.cells[2].innerHTML;
			params += "&dir=" + row.cells[3].innerHTML + "&otros=" + row.cells[4].innerHTML;
			params += "&sc=" + row.cells[5].innerHTML;
		
                        //the php is a simple insert function that returns the
                        //inserted record's id
		        xmlhttpNew.open("get","php_functions/agregarCandidato.php" + params,true);
			xmlhttpNew.send();			
		}

		//check for request state event
		xmlhttpNew.onreadystatechange=function()
		{
		  if (xmlhttpNew.readyState==4 && xmlhttpNew.status==200)
		  {
                        //show me the request's message (which should be the
                        //record's id in the database)
		  	alert(xmlhttpNew.responseText);

                        //add to row counter
		  	i++;

                        //allow for parameter creation and request sending
		 	sent = false
			
		  }
		
		}
		
	}
}

After executing this script, the browser successfully inserts the first row in the table, but runs into an infinite cycle in the second one. I honestly don't see where i'm missing the spot.

Any help would be eternally appreciated :D

[ndeniche]

Nevermind. Found a solution. I created an array for the xmlhttprequest variables, so each would have its independent page request. I realized I didn't need the responseText, so I deleted that part.

Here it is:

function guardarProceso(id)
{
	
	var table = document.getElementById('candidatos');
	
	var num = table.rows.length - 1;
	
	var xmlhttpNew = new Array();
	
	for (i = 0; i < num; i++)
	{
		if (window.XMLHttpRequest)
		{// code for IE7+, Firefox, Chrome, Opera, Safari
		  xmlhttpNew[i]=new XMLHttpRequest();
		}
		else
		{// code for IE6, IE5
		  xmlhttpNew[i]=new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
			
	if (window.XMLHttpRequest)
	{// code for IE7+, Firefox, Chrome, Opera, Safari
	  xmlhttpNew[i]=new XMLHttpRequest();
	}
	else
	{// code for IE6, IE5
	  xmlhttpNew[i]=new ActiveXObject("Microsoft.XMLHTTP");
	}
		
	row = table.rows[i+1];
	params = "?num=" + id + "&id=" + row.cells[0].innerHTML;
	params += "&nom=" + row.cells[1].innerHTML + "&tel=" + row.cells[2].innerHTML;
	params += "&dir=" + row.cells[3].innerHTML + "&otros=" + row.cells[4].innerHTML;
	params += "&sc=" + row.cells[5].innerHTML;

	xmlhttpNew[i].open("get","php_functions/agregarCandidato.php" + params,true);
	xmlhttpNew[i].send();			
	
	}
}