RSS

Re: javascript to add select button

Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting

javascript to add select button

•

Join Date: May 2005

Location: Wellington, New Zealand

Posts: 182

Reputation: alpha_foobar is an unknown quantity at this point

Rep Power: 4

Solved Threads: 3

alpha_foobar alpha_foobar is offline

Offline

Junior Poster

Re: javascript to add select button

Jul 26th, 2005

There are better resources for DOMs than MSDN.

http://www.mozilla.org/docs/dom/domref/dom_el_ref.html
http://www.w3.org/TR/REC-DOM-Level-1...-one-core.html
http://www.mozilla.org/docs/dom/domref/dom_el_ref.html

Also, I typically develop in Mozilla because of its excellent debug interface, first you get accurate information through the Javascript console (IE is almost always wrong in this regard). Secondly, you can add the Venkman Javascript debugger... Its awesome.

I just use MSDN when I have to make it work in Internet Explorer (that would be never if I got my way at work) and IE doesn't accept the Mozilla way of doing things... I wouldn't do it this way if IE debug environment was better.

Also, the mechanism of cloning a table row does make it easy (and browser independent). Though creating a dom structure yourself is a valid alternative.. I tend to avoid using innerHTML... it doesn't always work the same way as.. DOM traversal can become difficult - which isn't always a big deal... but usually is for me.

An example of table row cloning.. should be able to just paste this into an html page and play.. works in IE and Mozilla:

Help with Code Tags

(Toggle Plain Text)

<input type="button" value=" add " onclick="addRow()"/>

<table id="test_table">
   <tr id="template_row" bgcolor="red"><td><input type="text" name="b"/></td></tr>
</table>

<textarea id="innerHtml" style="border:1px dotted #639ACE" rows=20 cols=20></textarea>

<script type="text/javascript">
	var rowCount = 1;
	function addRow(){
		var rowNodeClone = document.getElementById("template_row").cloneNode(true);
		var tableNode 	= document.getElementById("test_table").getElementsByTagName("TBODY").item(0);
		var resultNode 	= document.getElementById("innerHtml");
	 
		rowNodeClone.id = "helloWorld" + (rowCount++);
		rowNodeClone.bgColor = "blue";
	   
		tableNode.appendChild(rowNodeClone);
	
		resultNode.value = tableNode.innerHTML
	   
	}
</script>

Last edited by alpha_foobar : Jul 26th, 2005 at 8:17 pm. Reason: removed close CODE tag

alphafoobar
Senior Java Developer
web2.0 javascript/ajax developer & entrepreneur

DaniWeb Home > Forums > Web Development > JavaScript / DHTML / AJAX > javascript to add select...

Re: javascript to add select button

javascript to add select button

Re: javascript to add select button