Stuff

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Double Dynamic Fields Creation</title><script language="javascript">function addCat(id_cat){	var container   	= document.getElementById('container');	 	 //Category	var l_cat 		= document.createTextNode('* Cat name');	var l_remove 	= document.createTextNode('Remove');	var e_cat      	= document.createElement('input');			e_cat.name 	= 'cat['+id_cat+']';		e_cat.id  	= 'cat['+id_cat+']';		e_cat.type 	= 'text';			var e_subcat_add      	= document.createElement('input');			e_subcat_add.name 	= 'subcat_add['+id_cat+']';		e_subcat_add.value 	= 'Add a subcategory ...';		e_subcat_add.id   	= 'subcat_add['+id_cat+']';		e_subcat_add.type 	= 'button';						e_subcat_add.onclick = function() {			addSubCat(id_cat, 1);        }			mycurrent_tab = document.createElement("table");		mycurrent_tab.setAttribute("border", "5");			mycurrent_tab.id =  "cat_container["+id_cat+"]";				mycurrent_body = document.createElement("tbody");					mycurrent_row = document.createElement("tr");												mycurrent_cell = document.createElement("td");						mycurrent_cell.appendChild(l_cat);						mycurrent_row.appendChild(mycurrent_cell);												mycurrent_cell = document.createElement("td");						mycurrent_cell.appendChild(e_cat);						mycurrent_row.appendChild(mycurrent_cell);												mycurrent_cell = document.createElement("td");						mycurrent_cell.appendChild(l_remove);						mycurrent_row.appendChild(mycurrent_cell);										mycurrent_tab.appendChild(mycurrent_row);								mycurrent_body.appendChild(mycurrent_row);									mycurrent_row = document.createElement("tr");												mycurrent_cell = document.createElement("td");						mycurrent_cell.colspan =3;						mycurrent_cell.appendChild(e_subcat_add);						mycurrent_row.appendChild(mycurrent_cell);				mycurrent_body.appendChild(mycurrent_row);			mycurrent_tab.appendChild(mycurrent_body);						container.appendChild(mycurrent_tab);}function addSubCat(id_cat, id_subcat){	var container   	= document.getElementById("cat_container["+id_cat+"]");		var l_subcat 		= document.createTextNode('* Name');	var l_remove 		= document.createTextNode('Remove');	var e_subcat      	= document.createElement('input');			e_subcat.name 	= 'subcat['+id_cat+']['+id_subcat+']';		e_subcat.id   	= 'subcat['+id_cat+']['+id_subcat+']';		e_subcat.type 	= 'text';				mycurrent_row = document.createElement("tr");									mycurrent_cell = document.createElement("td");					mycurrent_cell.appendChild(l_subcat);					mycurrent_row.appendChild(mycurrent_cell);								mycurrent_cell = document.createElement("td");					mycurrent_cell.appendChild(e_subcat);					mycurrent_row.appendChild(mycurrent_cell);										mycurrent_cell = document.createElement("td");					mycurrent_cell.appendChild(l_remove);					mycurrent_row.appendChild(mycurrent_cell);					container.appendChild(mycurrent_row);}</script></head><body><form action="testjsjs" method="post" name="bookAdd"><table style="border: solid 1px #000000;" width="100" border="0" cellspacing="0" cellpadding="3">  <tr>    <td bgcolor="#CCCCCC" colspan="2">Book</td>  </tr>  <tr>    <td>Name</td>    <td><input name="bookName" type="text" size="30" /></td>  </tr></table><br /><table style="border: solid 1px #000000;" width="100" border="0" cellspacing="0" cellpadding="3">  <thead>  <tr>    <td bgcolor="#CCCCCC" colspan="3">Cat</td>  </tr>  </thead>  <tbody>  <tr>    <td bgcolor="red" colspan="3">----------</td>  </tr>  <tr>    <td colspan="3" id="container"><!-- Here will be the cat table --></td>  </tr>  </tbody>  <tr>    <td colspan="3"><input name="catAdd" type="button" onclick="javascript:addCat(1);" value="Add a category ..." /></td>  </tr></table></form></body></html>