Javascript + form + table + rows

Add remove rows + textfields from a table in JS

For a future reminder on JS coding…

<script language=”Javascript” type=”text/javascript”>

/*

tmp is the prefix name of the field
globalform is the name of the form
data[Userpref/’+ tmp +’]’+(n)+'[‘ = the name of the var of the text field that will keep the value
YES all this code could be made so wouln’d be so redundant ; Life !!
*/    function addField(tmp)
{

input = document.createElement(“input”);

/* document.getElementById(‘globalform’).appendChild(input); */
var formGl = document.getElementById(“globalform”);
var allInputs = formGl.getElementsByTagName(“input”);
var n = allInputs.length;
n = n-2;
input.setAttribute(“type”, “text”);
input.setAttribute(“name”, ‘data[Userpref/’+ tmp +’]’+(n)+'[‘);

/* document.getElementById(‘globalform’).appendChild(input); */

var row = document.createElement(“tr”);
row.className = “altRow”;

var td1 = document.createElement(“td”);

td1.appendChild(document.createTextNode(tmp+n+ ” Match “));

var td2 = document.createElement(“td”);
td2.appendChild (input);

row.appendChild(td1);
row.appendChild(td2);

document.getElementById(‘globalform’).getElementsByTagName(“table”)[0].appendChild(row);

/* Describe field */

input = document.createElement(“input”);
input.setAttribute(“type”, “text”);
input.setAttribute(“name”, ‘Userpref/Describe’+tmp+’]’+(n)+'[‘);

/* document.getElementById(‘globalform’).appendChild(input); */

var row = document.createElement(“tr”);
row.className = “evenRow”;
var td1 = document.createElement(“td”);

td1.appendChild(document.createTextNode(tmp + ” “+ n + ” ” + “describe” ));

var td2 = document.createElement(“td”);
td2.appendChild (input);

row.appendChild(td1);
row.appendChild(td2);

document.getElementById(‘globalform’).getElementsByTagName(“table”)[0].appendChild(row);

}
/* Remove LastField from the table in the form */
function removeLast()
{
formGl = document.getElementById(“globalform”);
var myTb = formGl.getElementsByTagName(“table”);
var Trs = myTb[0].getElementsByTagName(‘tr’);

myTb[0].removeChild(Trs[Trs.length-1]);
}
</script>

Sobre Fernando André
SysAdmin, Website and Application Developer

Deixe uma Resposta

Please log in using one of these methods to post your comment:

Logótipo da WordPress.com

Está a comentar usando a sua conta WordPress.com Terminar Sessão / Alterar )

Imagem do Twitter

Está a comentar usando a sua conta Twitter Terminar Sessão / Alterar )

Facebook photo

Está a comentar usando a sua conta Facebook Terminar Sessão / Alterar )

Google+ photo

Está a comentar usando a sua conta Google+ Terminar Sessão / Alterar )

Connecting to %s

%d bloggers like this: