Click to See Complete Forum and Search --> : dynamically generated elements


tsanstef
11-28-2002, 05:03 PM
Hi folks.
I have troubles accesing a form element in Netscape 7. IE is fine.

I am populated a table dynamically via JS.
inHTML+=....
inHTML+="<input type='checkbox' name='check"+linenum+"' value='true' >";
....
tableObj.innerHTML=inHTML;
...
tableObj is the table that I am populating dynamically.
How can I access the elements that I have created with my JS?
I tried almost everything:
getElementById(..)..
forms[0].elements[...]
Even when I checked what are the form elements that I have non of the
dynamically generated is there.
Any ideas? Thanks!

gil davis
11-28-2002, 05:20 PM
Do you include <FORM> and </FORM>?

Otherwise, please post a link.

tsanstef
11-28-2002, 06:12 PM
here is a sample script.
You could try to access it from a form or directly but it does not work either way with Netscape
<SCRIPT LANGUAGE="JavaScript">
function populate(tableObj) {
inHTML = "<table border=1 id=t1 name=t1><tr><td>ff<input type='checkbox' name='check' value='true'></td>";
inHTML+= "<td>Some Text</td></tr></table>";
if(document.all) tableObj.outerHTML = inHTML;
else tableObj.innerHTML = inHTML;

}

function uncheck() {
if(document.all) {
document.all['check'].checked=false;
}else {
document.getElementById('check').checked=false;
}
}
</SCRIPT>

<BODY>
<form>

<table border=1 id=t1 name=t1>
<tr><td>&nbsp;</td><td>&nbsp;</td></tr>
</table>
</form>
<INPUT TYPE="button" value="Populate" onClick="populate((document.all ? document.all['t1'] : document.getElementById('t1')));">
<INPUT TYPE="button" value="Uncheck" onClick="uncheck();">
</BODY>

gil davis
11-28-2002, 08:21 PM
I do not know specifics on NS 7, but if NS 6.2 is any indicator, your HTML is not any good. Any incorrect HTML syntax will break the page and usually causes JS errors as well.

I stand by my original post, as your posting reveals that you are not enclosing all the form elements within a form (the bit at the bottom, after the closing form tag). Netscape strictly adheres to the W3C standards, and rightfully refuses to render your "illegal" syntax. Form elements are required to be within form tags, and you have not followed that rule.

IE allows what you have coded, because they apparently have no regard for standards.

tsanstef
11-29-2002, 08:39 AM
Hi Gil,

The problem is not in the inclusion of input elements inside the form. The buttons call a JS function that try to find a checkbox that was generated dynamically. Hence first you run populate function, it creates a table with a checkbox. You click on the checkbox and then you press the other button that runs uncheck function. getElementById cannot find the checkbox element - check. This is the big problem!
Anyway I included the buttons inside the form as you have advised and nothing changed.

Thank you!

gil davis
11-29-2002, 11:15 AM
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function populate(tableObj) {
inHTML = "<tr><td>ff<input type='checkbox' id='check' name='check' value='true'></td>"; // do you mean "checked"?
inHTML += "<td>Some Text</td></tr>";
tableObj.innerHTML = inHTML;
}

function uncheck() {
if (document.all)
{document.all['check'].checked=false;}
else
{document.getElementById('check').checked=false;}
}
</SCRIPT>
</head>
<BODY>
<form>
<table border=1 id="t1">
<tr><td> </td><td> </td></tr>
</table>
</form>
<form>
<INPUT TYPE="button" value="Populate" onClick="populate((document.all ? document.all['t1'] : document.getElementById('t1')));">
<INPUT TYPE="button" value="Uncheck" onClick="uncheck()">
</form>
</BODY>
</html>

tsanstef
11-29-2002, 12:35 PM
Just want to say 10x a lot.
The problem was the table tag for innerHTML I guess which makes perfect sense now! :-)