table added dynamically to div span on ie doesn't appear

[James Black]

I am dynamically generating a table in IE to display some information.
I will probably change it to divs later, but I just want to get it
working properly first.

In my div I have the following as the value of innerHTML:
"<TABLE>
<TR>
<TD id=td6x vAlign=top align=right><IM G height=14 alt=Required
src=\"/images/ci/icons/required.gif\" width=7 border=0
vAlign=\"top\"> <INPUT id=anchor6x width=0 size=10
readonly=\"read only\"></TD>
<TD><A id=urlanchor6x href=\"#ignore6 \"><IMG height=24
src=\"/images/ci/icons/calendar_s.gif\ " width=24 border=0
vAlign=\"bottom \"></A></TD></TR></TABLE>"

But, when I exit the function that generated this, there is nothing
displayed in IE, for what I wanted added.
This is the innerHTML value for the parent of the div above:

"<A name=#ignore6></A>
<DIV id=datespan6 style=\"VISIBIL ITY: visible\" _extended=\"tru e\">
<TABLE>
<TR>
<TD id=td6x vAlign=top align=right><IM G height=14 alt=Required
src=\"/images/ci/icons/required.gif\" width=7 border=0
vAlign=\"top\"> <INPUT id=anchor6x width=0 size=10
readonly=\"read only\"></TD>
<TD><A id=urlanchor6x href=\"#ignore6 \"><IMG height=24
src=\"/images/ci/icons/calendar_s.gif\ " width=24 border=0
vAlign=\"bottom \"></A></TD></TR></TABLE></DIV><INPUT id=lda6x
type=hidden _extended=\"tru e\"> "

Everything works fine in Firefox 1.5, but not in IE.

This is the code that generated the table:
var anchorName = "anchor" + indx + "x";
var tdChildEl = document.create Element("td");
tdChildEl.align = "right";
tdChildEl.vAlig n = "top";
tdChildEl.id = "td" + indx + "x";
var imgelem = document.create Element('img');
imgelem.src = "/images/ci/icons/required.gif";
imgelem.alt = "Required";
imgelem.vAlign = "top";
imgelem.border = "0";
imgelem.height = "14";
imgelem.width = "7";
tdChildEl.appen dChild(imgelem) ;

var inputChildEl = document.create Element("input" );
inputChildEl.ty pe = "text";
inputChildEl.na me="date" + indx;
inputChildEl.va lue = $('lda' + indx + 'x').value;
inputChildEl.id = anchorName;
inputChildEl.on mouseout = ModifyGrades.ha ndlemouseout;
inputChildEl.on mouseover = ModifyGrades.ha ndlemouseover;
inputChildEl.on click = ModifyGrades.da teSelect;
inputChildEl.wi dth = "10em";
inputChildEl.si ze = 10;
inputChildEl.se tAttribute("rea donly","readonl y");

tdChildEl.appen dChild(inputChi ldEl);
var rowelem = document.create Element('tr');
rowelem.appendC hild(tdChildEl) ;

var aChildEl = document.create Element("a");
aChildEl.href = "#ignore" + indx;
aChildEl.name = anchorName;
aChildEl.id = "url" + anchorName;
aChildEl.onclic k = function(){
ModifyGrades.ca llCalendarIcon( document.forms[0]["date"+indx], "url" +
anchorName); return false; }
var calImgEl = document.create Element('img');
calImgEl.src = "/images/ci/icons/calendar_s.gif" ;
calImgEl.vAlign = "bottom";
calImgEl.border = "0";
aChildEl.append Child(calImgEl) ;
tdChildEl = document.create Element('td');
tdChildEl.appen dChild(aChildEl );
rowelem.appendC hild(tdChildEl) ;

var tableelem = document.create Element('table' );
tableelem.appen dChild(rowelem) ;
span.appendChil d(tableelem);
span.style.visi bility="visible ";
Any idea on what I might be doing wrong?

Thank you for any help.

[Randy Webb]

James Black said the following on 4/27/2006 1:22 PM:

I am dynamically generating a table in IE to display some information.
I will probably change it to divs later, but I just want to get it
working properly first.
<snip>
Any idea on what I might be doing wrong?

You can't appendChild a TR to a TABLE tag, you have to append it to a
TBODY and IE won't let you do it any other way.

--
Randy
comp.lang.javas cript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[RobG]

Randy Webb said on 28/04/2006 9:34 AM AEST:

James Black said the following on 4/27/2006 1:22 PM:

I am dynamically generating a table in IE to display some information.
I will probably change it to divs later, but I just want to get it
working properly first.

<snip>

Any idea on what I might be doing wrong?

You can't appendChild a TR to a TABLE tag, you have to append it to a
TBODY and IE won't let you do it any other way.

var oRow = table.insertRow (-1);
:-)

--
Rob
Group FAQ: <URL:http://www.jibbering.c om/FAQ>