Problem dynamically adding data to an existing table ...

[Melissa Mussitsch]

I've done this before while creating a brand new table.
But the code below is not working and I keep getting the error:
"Internet Explorer cannot open the Internet site .....
Operation aborted"

Here is the code:

myBody=document .getElementsByT agName("body"). item(0);
mytablebody = document.getEle mentById('produ ct').getElement sByTagName("TBO DY" )[0];

newrow=document .createElement( "TR");
newrow.setAttri bute("bgColor", "#EFECCB");

//Family
newcell=documen t.createElement ("TD");
currenttext=doc ument.createTex tNode("Family") ;
newcell.appendC hild(currenttex t);
newcell.setAttr ibute("width"," 10");
newcell.setAttr ibute("align", "center");
newrow.appendCh ild(newcell);
//Product Description
newcell=documen t.createElement ("TD");
currenttext=doc ument.createTex tNode("Product Description");
newcell.appendC hild(currenttex t);
newcell.setAttr ibute("align", "center");
newrow.appendCh ild(newcell);
mytablebody.app endChild(newrow );

It's pretty basic code. I put the TR, TD, TD in by hand and it worked fine.
I wanted to make sure it wasn't because I had some mismatching <TABLE> tags.

Any ideas?
Melissa Mussitsch

[Martin Honnen]

Re: Problem dynamically adding data to an existing table ...



Melissa Mussitsch wrote:
[color=blue]
> I've done this before while creating a brand new table.
> But the code below is not working and I keep getting the error:
> "Internet Explorer cannot open the Internet site .....
> Operation aborted"
>
> Here is the code:
>
> myBody=document .getElementsByT agName("body"). item(0);
> mytablebody = document.getEle mentById('produ ct').getElement sByTagName("TBO DY" )[0];
>
> newrow=document .createElement( "TR");
> newrow.setAttri bute("bgColor", "#EFECCB");
>
> //Family
> newcell=documen t.createElement ("TD");
> currenttext=doc ument.createTex tNode("Family") ;
> newcell.appendC hild(currenttex t);
> newcell.setAttr ibute("width"," 10");
> newcell.setAttr ibute("align", "center");
> newrow.appendCh ild(newcell);
> //Product Description
> newcell=documen t.createElement ("TD");
> currenttext=doc ument.createTex tNode("Product Description");
> newcell.appendC hild(currenttex t);
> newcell.setAttr ibute("align", "center");
> newrow.appendCh ild(newcell);
> mytablebody.app endChild(newrow );
>
> It's pretty basic code. I put the TR, TD, TD in by hand and it worked fine.
> I wanted to make sure it wasn't because I had some mismatching <TABLE> tags.
>
> Any ideas?[/color]

Are you sure that your code posted above causes the "error"? How do you
call that code? It seems more likely that you have some link causing
that message.

--

Martin Honnen
http://JavaScript.FAQTs.com/

[Melissa Mussitsch]

Re: Problem dynamically adding data to an existing table ...

Well after doing further research, I see that the error message is a
pretty standard one and could mean a number of things. I ended up
getting the code to write one row successfully. However, at the very
end, I still get this error. And the only thing left after these
statements is </FORM></BODY></HTML>!
For this project I've tried adding this code to an already enormous asp
page. I think I'm going to have to split it out to get it working and
then try to plug it back in. I don't get it when I pull that code back
out though.

I have this code called after variables and arrays are filled in and
some web form objects are already drawn on the page. I simply have my
<SCRIPT> tag and call the function to create the table and write a
couple rows (for now). When I remove these three lines from my code I
don't get the error:
1)<SCRIPT language=""Java Script"">var
mybody=document .getElementsByT agName("body"). item(0);mytable =document.cr
eateElement("TA BLE");</SCRIPT>
2)<SCRIPT language=""Java Script"">WriteT able(mytable,<% =iarrMax%>, '',
'');</SCRIPT>
3)<SCRIPT language=""Java Script"">mybody .appendChild(my table);</SCRIPT>

Of course WriteTable does most of the work.

Thank you.
Melissa M

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

[Melissa Mussitsch]

Re: Problem dynamically adding data to an existing table ...

Ok - I've been able to simplify this and still get the error.

Again I have three lines:
<SCRIPT language="JavaS cript">var
mybody=document .getElementsByT agName("body"). item(0);mytable =document.cr
eateElement("TA BLE");</SCRIPT>
<SCRIPT language="JavaS cript">WritePro ductList(mytabl e,
<%=iarrMax%>) ;</SCRIPT>
<SCRIPT language="JavaS cript">mybody.a ppendChild(myta ble);</SCRIPT>

Here is the code for WriteProductLis t:
function WriteProductLis t(mytable, iarrMax) {

var mytablebody;
var newrow;
var newcell;
var currenttext;

mytable.setAttr ibute("width"," 100%");
mytable.setAttr ibute("border", "1");
mytable.setAttr ibute("id","pro ductselect");
mytablebody=doc ument.createEle ment("TBODY");

newrow=document .createElement( "TR");

//Family
newcell=documen t.createElement ("TD");
currenttext=doc ument.createTex tNode("Family") ;
newcell.appendC hild(currenttex t);
newrow.appendCh ild(newcell);
newrow.appendCh ild(newcell);

mytablebody.app endChild(newrow );
mytable.appendC hild(mytablebod y);
}

It's very simple in that it writes one row to the table.
Let me say that I am getting my row in the table.
But as soon as it gets to the "mybody.appendC hild(mytable);" part, the
error appears. And without it, I don't get the row.

Does anyone see something obviously wrong?

Thank you.
Melissa M

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

[Melissa Mussitsch]

Re: Problem dynamically adding data to an existing table ...

Ok - sorry for all the threads. I know it has to be something stupid
because I've ripped it all out and have a very simple ASP page and still
get the error. I've even copied an example from online. I've spent
hours on this - please let me know if you see something wrong!

<%Response.Buff er = True
%>

<html>
<head>
<title>Eval Center</title>

<SCRIPT language="JavaS cript">
function WriteProductLis t() {

var mybody=document .getElementsByT agName("body"). item(0);
mytable = document.create Element("TABLE" );
mytablebody = document.create Element("TBODY" );
for(j=0;j<2;j++ ) {
mycurrent_row=d ocument.createE lement("TR");
for(i=0;i<2;i++ ) {
mycurrent_cell= document.create Element("TD");
currenttext=doc ument.createTex tNode("cell is row "+j+", column
"+i);
mycurrent_cell. appendChild(cur renttext);
mycurrent_row.a ppendChild(mycu rrent_cell);
}
mytablebody.app endChild(mycurr ent_row);
}
mytable.appendC hild(mytablebod y);
mybody.appendCh ild(mytable);
mytable.setAttr ibute("border", "2");
}
</SCRIPT>

</head>

<body>
<form>

<SCRIPT language="JavaS cript">WritePro ductList();</SCRIPT>
</form>

</body>
</html>

Thank you.
Melissa M

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

[RobG]

Re: Problem dynamically adding data to an existing table ...

Melissa Mussitsch wrote:[color=blue]
> Ok - sorry for all the threads. I know it has to be something stupid
> because I've ripped it all out and have a very simple ASP page and still[/color]

Ahh, yes, incredibly stupid :-) in fact ... you'll kikc yourself.
I was going to write this at the very bottom, but I'll let you know
now:

Because you didn't specify an action on your form element, IE barfs.
Why is open to conjecture - either get rid of the form or add an
action:

<form action="">
...

A good reason to post code, 'cos your problem wasn't JS or ASP but HTML
and IE combined (Firefox was quite happy with the errant tag).

Even though your JS works fine, a couple of hints (please ignore if you
have already dealt with them):
[color=blue]
> var mybody=document .getElementsByT agName("body"). item(0);[/color]

You should do feature detection before using getElements... and use an
alternative if it fails. There are plenty of examples in the archives.
[color=blue]
> mytable = document.create Element("TABLE" );
> mytablebody = document.create Element("TBODY" );
> for(j=0;j<2;j++ ) {
> mycurrent_row=d ocument.createE lement("TR");[/color]

Use "var" to keep mycurrent_row local. It's probably trivial here,
but worth doing.

var mycurrent_row=d ocument.createE lement("TR");
[color=blue]
> for(i=0;i<2;i++ ) {
> mycurrent_cell= document.create Element("TD");[/color]

same for mycurrent_cell and currenttext...
[color=blue]
> currenttext=doc ument.createTex tNode("cell is row "+j+", column
> "+i);
> mycurrent_cell. appendChild(cur renttext);
> mycurrent_row.a ppendChild(mycu rrent_cell);
> }
> mytablebody.app endChild(mycurr ent_row);
> }
> mytable.appendC hild(mytablebod y);
> mybody.appendCh ild(mytable);
> mytable.setAttr ibute("border", "2");[/color]

Using "setAttribu te" destroys any attributes that the element already
has, so it's not considered nice. Again, probably trivial but may
cause you problems later if you use it twice on the same element. Try:

mytable.style.b order = 'thin solid red';

For a border, you have to set all the attributes, either in one go as
above or individually:

mytable.style.b orderWidth = 'thin';
mytable.style.b orderStyle = 'solid';
mytable.style.b orderColor = 'red';

It's probably better to do the style attributes before adding the row
to the table too:

mytable.style.b order = 'thin solid red';
mybody.appendCh ild(mytable);
[color=blue]
> }
> </SCRIPT>
>
> </head>
>
> <body>
> <form>[/color]

The form element should have an action, even if it's action=""
[color=blue]
>
> <SCRIPT language="JavaS cript">WritePro ductList();</SCRIPT>
> </form>[/color]

I guess you've put the table inside a form to help layout the form
elements - otherwise, there is no need for it.

Anyhow, all just advice, none of it will fix your problem. :-)

Cheers, Rob.

[RobG]

Re: Problem dynamically adding data to an existing table ...

RobG wrote:
[...][color=blue]
> Ahh, yes, incredibly stupid :-) in fact ... you'll kikc yourself.
> I was going to write this at the very bottom, but I'll let you know
> now:
>
> Because you didn't specify an action on your form element, IE barfs.
> Why is open to conjecture - either get rid of the form or add an
> action:
>
> <form action="">
> ...
>[/color]

Ahhh, ooops!! I also moved calling the function to:

<body onload="WritePr oductList();">

and got rid of the <script...> in the form - that was the *real* fix!

Sorry about that. :-p

Rob

[Melissa Mussitsch]

Re: Problem dynamically adding data to an existing table ...

Well I answered my own question.
Once I appended the table to my form it worked.

Thank you for directing me to the form, I would have never looked there.
And I will look again at your suggestions.

Thank you for all your time and help!
Melissa M

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

[Melissa Mussitsch]

Re: Problem dynamically adding data to an existing table ...

Oh - Just for kicks I did test <SCRIPT
language="JavaS cript">alert('h i');</SCRIPT> inside the form and it works
fine. So I guess it's not the <SCRIPT> tag itself but the dynamic
building of the tables.

I wish I knew specifically what it didn't like.
It seems to be appending the table to the body when I got the error. Do
you think I need to append the table to the form object instead?

Thank you.
Melissa M

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

[Melissa Mussitsch]

Re: Problem dynamically adding data to an existing table ...

Ok. I'm still confused.
I'm working now just with my simple example.
I took the <form> totally out and as you mentioned, it gets rid of the
error.

However, I think that I do need the form. I may be able to get away
without it. Ultimately I'll need to be able to retrieve all values from
a different table. And if I traverse using DOM, perhaps I won't need
the form. But just in case, I tried (in my simple example) to add <form
action="" name="mainform" method="post"> and I get the error again.

So - I believe you're right in the <form> does not like the <script>
call to my table build inside it. I just confirmed in my other
application that I swore was working with all this - I ended the </form>
prior to call the <script> which is why it works. (I just got lucky
there)

I appreciate all your other suggestions above. I've taken most of this
dynamic table creation from the internet and love the flexibility and
power of it, but probably don't do it all the best way. I shift things
all around until it works and especially didn't realize there was a
better order to the attributes.

If you can think of anyway the <FORM> will allow the <SCRIPT>, please
let me know. Otherwise, I'll try to work without the form.

Thanks so much for your help! This just about killed me yesterday!

Thank you.
Melissa M

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

[RobG]

Re: Problem dynamically adding data to an existing table ...

Melissa Mussitsch wrote:[color=blue]
> Ok. I'm still confused.
> I'm working now just with my simple example.
> I took the <form> totally out and as you mentioned, it gets rid of the
> error.[/color]
[...][color=blue]
> If you can think of anyway the <FORM> will allow the <SCRIPT>, please
> let me know. Otherwise, I'll try to work without the form.[/color]
[...]

I have noticed that mixing tables and forms in IE has some
peculiarities not shared with other browsers. From memory I think you
need to obey nesting rules and not say start a form inside a cell and
end it inside another - but that may just have been the DTD I was
using.

The simple solution in this case is don't put <script> tags inside a
form - I can't think of any imperatives for them to be there. Or you
could build the entire form from the script using say a DIV as an
anchor for the form - as it is now, you are only saving two lines of
code by using the form tag as an anchor.

If you want to build the form when the page loads, use an onload in the
body tag to call a function script in the header - I always do it that
way anyway (and now I even have a reason for doing it!).

Any other scripting inside the form should be inside tags using
onclick, onblur, onchange, etc.

Anyhow, have fun trying things out. Maybe you should log it as a bug
in IE and see what happens...

Cheers, Rob.