...

View Full Version : how to create a table after the page have loaded?



guowei1000
06-11-2004, 06:37 AM
can i create a table after the page have loaded and put that table in a already created table? for example

<a onClick='javaScript:somenamefunction(this)>click this to create table </a>

function somenamefunction(counter)
{
document.writeln("<table>")
document.writeln("<tr>")
document.writeln("<td>")
document.writeln("test")
document.writeln("</td>")
document.writeln("</tr>")
document.writeln("</table>")
}

but how do i put this table into another table that have already being created? :confused:

neofibril
06-11-2004, 07:11 AM
How to Build Tables Dynamically (http://msdn.microsoft.com/workshop/author/tables/buildtables.asp)

guowei1000
06-11-2004, 07:13 AM
so nw i know how to make a table, how to make a table that go into a table when u onClick some text? that i dunno ...

neofibril
06-11-2004, 07:49 AM
All DHTML and DOM methods for that are either described in the article, or linked to from it.

guowei1000
06-11-2004, 09:02 AM
u did read throught the thing right?

neofibril
06-11-2004, 09:43 AM
If you are looking for a literal explanation of: "how to make a table that go into a table when u onClick some text", that would be an unlikely find.
Several methods are at your disposal, however.

guowei1000
06-11-2004, 10:30 AM
arhh, i think i din make my self clear at the first place, i'm a newbie when it come to javascript so i was hoping for some tutorial on this topic :p

jbot
06-11-2004, 11:25 AM
i was hoping for some tutorial on this topic

or else, you were hoping for someone to write the script for you ;)

the MSDN link above is one of the best places to look. and gives you the code you need. you just have to work out how to put it all together :p

guowei1000
06-14-2004, 04:56 AM
finally able to write out the coding !! YES! but nw faces new problem, i dunno how to toogle the style display... hmmmm heres the code if anyone is interested, Thanks for all ur help :D :thumbsup:


<html>
<head>
<script language ="JAVASCRIPT">
var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.load("note.xml");
var strContent =""
var transfernode =""
function TestChildren(nodes)
{
document.writeln("<table border = 1>");
document.writeln("<tr>");
document.writeln("<td>");
document.writeln("<A onClick='javaScript:toogle_state(this)'><font color= red><IMG SRC='minus.gif'>"+ nodes.nodeName +"</font></A>");
if (nodes.hasChildNodes)
{
for (var i=0; i < nodes.childNodes.length; i++)
{
document.writeln("<table border = 1>");
document.writeln("<tr>");
document.writeln("<td>");
if (nodes.childNodes(i).hasChildNodes) // add toogle in
{
document.writeln("<font color= red><A onClick='javaScript:toogle_state(this)'><IMG SRC='minus.gif'>"+nodes.childNodes(i).nodeName +"</A></font>");
writechildren(nodes.childNodes(i))
}
else
{
document.writeln(nodes.childNodes(i).nodeName);
}
document.writeln("</tr>");
document.writeln("</td>");
document.writeln("</table>");
}
}
document.writeln("</td>");
document.writeln("</tr>");
document.writeln("</table>");
}

function toogle_state(nodeCounter)
{

// Unfold the branch if it isn't visible
alert(nodeCounter.childNodes(0).nodeName + nodeCounter.childNodes(1).data)
if (nodeCounter.nextSibling.style.display == 'none')
{

// Change the image (if there is an image)
if (nodeCounter.children.length > 0)
{
if (nodeCounter.children.item(0).tagName == "IMG")
{
nodeCounter.children.item(0).src = "minus.gif";
}
}
nodeCounter.nextSibling.style.display = '';
}
// Collapse the branch if it IS visible
else
{
// Change the image (if there is an image)
if (nodeCounter.children.length > 0)
{
if (nodeCounter.children.item(0).tagName == "IMG")
{
nodeCounter.children.item(0).src = "plus.gif";
}
}

nodeCounter.nextSibling.style.display = 'none';

}
}


function writechildren(sianz)
{
if (sianz.hasChildNodes)
{
for (var i=0; i < sianz.childNodes.length; i++)
{
document.writeln("<table border = 1>");
document.writeln("<tr>");
document.writeln("<td>");

if (sianz.childNodes(i).hasChildNodes) // add toogle in
{

if (sianz.childNodes(i).nodeName == "#text")
{
document.writeln("<font color= red><A onClick='javaScript:toogle_state(this)'><IMG SRC='minus.gif'>"+ sianz.childNodes(i).text + "</A></font>");
writechildren(sianz.childNodes(i))
}
else
{
document.writeln("<font color= red><A onClick='javaScript:toogle_state(this)'><IMG SRC='minus.gif'> "+ sianz.childNodes(i).nodeName + "</A></font>");
writechildren(sianz.childNodes(i))
}

}
else
{
if (sianz.childNodes(i).nodeName == "#text")
{
document.writeln(sianz.childNodes(i).text);
writechildren(sianz.childNodes(i))
}
else
{
document.writeln(sianz.childNodes(i).nodeName);
writechildren(sianz.childNodes(i))
}
}

document.writeln("</tr>");
document.writeln("</td>");
document.writeln("</table>");
}
}

}
function callReadXml()
{
root = xmlDoc.documentElement;
TestChildren(root);
}
</script>
</head>
<body>
<script type="text/javascript">
callReadXml();
</script>
</body>
</html>


p.s my function toogle state function dun work and i dunno how to make it work hai~~

guowei1000
06-14-2004, 06:12 AM
sry for the double post, but i was wondering if anyone can help? i cant seem to be able to do the function toogle_state for the above code.Can anyone help? i cant seem to locate the child table and so wasnt able to change it style.display. can anyone help me by telling me hw to locate the child table?

guowei1000
06-14-2004, 08:58 AM
yoyo, finally got it ! :D thanks for all ur help :D:D now i can do a table and toogle it state yes! now i just need to do it frames.... hmmmm



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum