Home | Contact Us | FAQ | Search & Site Map | Link to Us
Sign In | Join | Other 45 Sites in Network
Home
Discussion GroupsGeneralPHPASPPerlColdFusionFlashHTML, CSS, ScriptsBrowsers

Webmaster Forum / HTML, CSS, Scripts / JavaScript / May 2007



Tip: Looking for answers? Try searching our database.

Unable to create a table in IE using Javascript.

Thread view: 
Enable EMail Alerts  Start New Thread
Thread rating: 
noagbodjivictor@gmail.com - 30 May 2007 01:45 GMT
I don't know the problem with IE6. I have tried three methods, and
they all failed. I eliminated the use of mootools' framework in method
3. MooTools is not the problem. Because the table is created but is
not showing up. I have checked that with IE developper toolbar.

1st method

        for(var i = 0; i < thelines.length; i++) {
            var newrow = new Element('tr');
            for(var j = 0; j < (posArray.length - 1); j++){
                var newcol = new Element('td').appendText(result[i][j]);
                newcol.injectInside(newrow);
            }
            newrow.injectInside($('result'));
        }

2nd method

               for(var i = 0; i < thelines.length; i++ )
        {
            var newrow = new Element('tr');
            for(var j = 0; j < (posArray.length - 1); j++){
                var newcol = new Element('td');
                var txt = document.createTextNode(result[i][j]);
                newcol.appendChild(txt);
                newrow.appendChild(newcol);
            }
            $('result').appendChild(newrow);
        }

3rd method

        var oTable = document.createElement('table');
        var oRow, oCell;
        oTable.id = 'result';
        for(var i = 0; i < thelines.length; i++ )
        {
            oRow = document.createElement('tr');
            for(var j = 0; j < (posArray.length - 1); j++)
            {
                   oCell = document.createElement('td');
                oCell.innerText = result[i][j];
                oCell.textContent = result[i][j];
                oRow.appendChild(oCell);
            }
            oTable.appendChild(oRow);
        }
        oTableContainer = document.getElementById('tablecontainer');
        oTableContainer.appendChild(oTable);
Gérard Talbot - 30 May 2007 02:35 GMT
noagbodjivictor@gmail.com wrote :
> I don't know the problem with IE6. I have tried three methods, and
> they all failed. I eliminated the use of mootools' framework in method
> 3. MooTools is not the problem. Because the table is created but is
> not showing up. I have checked that with IE developper toolbar.

First problem: you have posted code and you have not posted an URL where
we can examine all of the page code. Do not post code; post an URL.

> 1st method
>
>         for(var i = 0; i < thelines.length; i++)

How do you create, how have you created the "thelines"? We can not read
that.

{
>             var newrow = new Element('tr');

What's the Element object? We can not see that.

I disagree and do not recommend creating your own functions when DOM 1
and DOM 2 functions have been already defined, created for such
purposes: why not use createElement() when it has been defined already
and when it should work in all DOM compliant browsers?

>             for(var j = 0; j < (posArray.length - 1); j++){
>                 var newcol = new Element('td').appendText(result[i][j]);
>                 newcol.injectInside(newrow);

Where is the injectInside function? We can not examine that.

Same comment here too. Why not use the DOM standard appendChild()
function which has been defined, standardized for all DOM compliant
browsers?

>             }
>             newrow.injectInside($('result'));
[quoted text clipped - 17 lines]
>
>         var oTable = document.createElement('table');

var oTbody = document.createElement("tbody");
If I recall correctly, MSIE 6+ requires the creation of a tbody (or
table section like thead or tfoot) to append table rows.

>         var oRow, oCell;
>         oTable.id = 'result';
>         for(var i = 0; i < thelines.length; i++ )
>         {
>             oRow = document.createElement('tr');
>             for(var j = 0; j < (posArray.length - 1); j++)

Please verify that you need to substract 1 to the posArray.length. We
can't do this ... without looking to the whole code. An url ...

>             {
>                     oCell = document.createElement('td');
>                 oCell.innerText = result[i][j];
>                 oCell.textContent = result[i][j];

Right here, the code is not precise.

Try instead:

oCell.appendChild(document.createTextNode(result[i][j]));

>                 oRow.appendChild(oCell);
>             }
>             oTable.appendChild(oRow);

Instead,

oTbody.appendChild(oRow);

>         }

Now, when the external for loop (for rows) is done, append the tbody to
the table:

oTable.appendChild(oTbody);

>         oTableContainer = document.getElementById('tablecontainer');
>         oTableContainer.appendChild(oTable);

Since you are going, it seems, to be refering to oTableContainer only
once, then you can merge the 2 above instructions into a single one with:

document.getElementById("tablecontainer").appendChild(oTable);

If the above suggestions do not work, then post an url and we'll look at
the whole code.

Gérard
Signature

Using Web Standards in your Web Pages (Updated Apr. 2007)
http://developer.mozilla.org/en/docs/Using_Web_Standards_in_your_Web_Pages

Gérard Talbot - 30 May 2007 02:49 GMT
Gérard Talbot wrote :

>> 3rd method
>>
[quoted text clipped - 3 lines]
> If I recall correctly, MSIE 6+ requires the creation of a tbody (or
> table section like thead or tfoot) to append table rows.

"If DOM Core methods document.createElement and element.appendChild are
used to create rows and cells, IE requires that they are appended to a
tbody element, whereas other browsers will allow appending to a table
element (the rows will be added to the last tbody element)."
http://developer.mozilla.org/en/docs/Gecko_DOM_Reference:Examples#Notes

Gérard
Signature

Using Web Standards in your Web Pages (Updated Apr. 2007)
http://developer.mozilla.org/en/docs/Using_Web_Standards_in_your_Web_Pages

noagbodjivictor@gmail.com - 30 May 2007 02:58 GMT
Thanks Gerard. You are right.

> "If DOM Core methods document.createElement and element.appendChild are
> used to create rows and cells, IE requires that they are appended to a
> tbody element, whereas other browsers will allow appending to a table
> element (the rows will be added to the last tbody
Dr J R Stockton - 31 May 2007 19:48 GMT
In comp.lang.javascript message <135pl6vjvrce154@corp.supernews.com>,
Tue, 29 May 2007 21:35:23, Gérard Talbot <newsblahgroup@gtalbot.org>
posted:

>First problem: you have posted code and you have not posted an URL
>where we can examine all of the page code. Do not post code; post an
>URL.

Dial-up users with off-line newsreaders won't like that at all.  Others
may prefer not to go to strange URLs on anonymous advice.

Consensus is that problems should be reduced to the minimum code that
shows the problem (that often solves it) and posted here by
copy'n'paste.  A URL in addition can be good, but not a URL instead.

It's a good idea to read the newsgroup c.l.j and its FAQ.  See below.

Signature

(c) John Stockton, Surrey, UK.  ?@merlyn.demon.co.uk   Turnpike v6.05   IE 6
news:comp.lang.javascript FAQ <URL:http://www.jibbering.com/faq/index.html>.
<URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
<URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.

 
Sign In
Join
My Latest Posts
My Monitored Threads
My Blog
My Photo Gallery
My Profile
My Homepage

Start New Thread
Enable EMail Alerts
Rate this Thread



©2009 Advenet LLC   Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.