I am having trouble getting my HTML from "inputtext" to create a form element which can be deleted or added via incrementing, from the javascript. Here it is:
I am trying to get the script to print out an add and remove buttons which can add new input rows and delete rows as well. My problem at this point is getting the HTML to output via "document.createTextNode" which I am sure cannot handle HTML but I am not familiar with what to do and how to get it done. If any one can provide me with an example which works, I will have a better idea on implementing this.
Thanks!
Rninja
Code:
<script type="text/javascript">
var counter = 0;
function insertdiv(){
inputtext="<table width='100%' cellpadding='0' cellspacing='0'><tr><td width='45%'><input type='text' name=name1+counter size='50'></td><td width='21%'><input type='text' name=name2+counter></td><td width='26%'><input type='text' name=name3+counter></td></tr></table>";
var newdiv = document.createElement('div');
var newpara = document.createElement('p');
var thetext = document.createTextNode(inputtext+counter);
newpara.appendChild(thetext);
newdiv.appendChild(newpara);
newdiv.setAttribute('class','floater')
newdiv.setAttribute('className','floater')
var idname = 'div'+counter;
newdiv.setAttribute('id',idname);
document.getElementById('jstest').appendChild(newdiv);
counter++;
}
function deldiv(){
var elem=document.getElementById('jstest');
elem.removeChild(elem.lastChild);
}
</script>
<body>
<form name=1>
<div id="jstest">
<a href=javascript:insertdiv()>Click</a><br>
<a href=javascript:deldiv()>Remove</a>
</form>I am trying to get the script to print out an add and remove buttons which can add new input rows and delete rows as well. My problem at this point is getting the HTML to output via "document.createTextNode" which I am sure cannot handle HTML but I am not familiar with what to do and how to get it done. If any one can provide me with an example which works, I will have a better idea on implementing this.
Thanks!
Rninja
