Here is my main HTML document ("demo.html"):
<html>
<head>
<title>Example</title>
<script language="javascript">
function populateFrames()
{
var x = new ActiveXObject("Microsoft.XMLDOM");
var s = new ActiveXObject("Microsoft.XMLDOM");
x.async = false
s.async = false
x.load("prime.xml");
s.load("customers.xsl");
var html = x.transformNode(s);
var destination = document.frames("main").document.open("text/html",
"replace");
destination.write(html);
}
</script>
</head>
<frameset onload="populateFrames()" rows="*,64">
<frame name="main" scrolling="yes">
<frame name="footer" scrolling="no" noresize target="main" src=http://www.webdeveloper.com/forum/archive/index.php/"legend.html">
</frameset>
</html>
--------------------------------------------------------------
Here is my XML document ("prime.xml")
<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="customers.xsl"?>
<database>
<element>
<transaction>
<day>Monday</day>
<time>2:00pm</time>
</transaction>
</element>
<element>
<customer>
<name>Dan Subaitani</name>
<order>Big Screen TV</order>
<price>$5000.00</price>
</customer>
</element>
<element>
<transaction>
<day>Wednesday</day>
<time>4:30pm</time>
</transaction>
</element>
<element>
<customer>
<name>Renato Guevara</name>
<order>laptop</order>
<price>$2000.00</price>
</customer>
</element>
<element>
<customer>
<name>Andrew Gabino</name>
<order>Keyboard</order>
<price>$20.00</price>
</customer>
</element>
<element>
<customer>
<name>Melody Heydari</name>
<order>Tablet PC</order>
<price>$400.00</price>
</customer>
</element>
</database>
------------------------------------------------------------------
Here is my XSL stylesheet ("customers.xsl")
<?xml version="1.0" encoding="ISO-8859-1" ?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl
utput method="html" indent="yes" />
<xsl:template match="/database">
<html>
<head>
<title>clients</title>
<script type="text/javascript">
<![CDATA[
function show_hide()
{
var st1;
if(button1.value=="Hide Name")
{
st1="none";
button1.value="Show Name";
}
else
{
st1="block";
button1.value="Hide Name";
}
var tb1 = document.getElementById("main");
var rows1 = tb1.getElementsByTagName("tr");
for (var row=0; row<rows1.length; row++)
{
var cels = rows1[row].getElementsByTagName("td");
cels[0].style.display=st1;
}
}
function show_hide_tran()
{
var st1;
if(button2.value=="Hide Transactions")
{
st1="none";
button2.value="Display Transactions";
}
else
{
st1="block";
button2.value="Hide Transactions";
}
var tb2 = document.getElementById("main");
var rows2 = tb2.getElementsByTagName("tr");
var cels2 = rows2[0].getElementsByTagName("td");
for (var index=0; index<rows2.length; index++)
{
if (rows2[index].style.color == "blue")
{
rows2[index].style.display = st1;
}
}
}
]]>
</script>
</head>
<body>
<input type="button" id="button1" value="Hide Name" onClick="show_hide()"/>
<input type="button" id="button2" value="Hide Transactions" onClick="show_hide_tran()"/>
<table id="main" border="3" cellspacing="1" cellpadding="1">
<xsl:apply-templates select="element"/>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="element">
<xsl:apply-templates select="customer" />
<xsl:apply-templates select="transaction" />
</xsl:template>
<xsl:template match="customer">
<tr>
<td><xsl:apply-templates select="name"/></td>
<td><xsl:apply-templates select="order"/></td>
<td><xsl:apply-templates select="price"/></td>
</tr>
</xsl:template>
<xsl:template match="transaction">
<tr style="color:blue">
<td><xsl:apply-templates select="day"/></td>
<td colspan="2"><div><xsl:apply-templates select="time"/></div></td>
</tr>
</xsl:template>
</xsl:stylesheet>
-----------------------------------------------------------
and here is another HTML document("legend.html")
<html>
<head>
</head>
<body>
<input type="button" id="button1" value="Hide Name" onClick="renato()">
<input type="button" id="button2" value="Hide Transactions" onClick="guevara()">
</body>
</html>
------------------------------------------------
What I'm trying to do is have the buttons located in legend.html call the functions that are in the script from customers.xsl to control the table actions. I don't know how to call functions from one frame which was originally in xsl in another frame which is html. Thank you in advance. Any leads would be greatly appreciated.
Renato
<html>
<head>
<title>Example</title>
<script language="javascript">
function populateFrames()
{
var x = new ActiveXObject("Microsoft.XMLDOM");
var s = new ActiveXObject("Microsoft.XMLDOM");
x.async = false
s.async = false
x.load("prime.xml");
s.load("customers.xsl");
var html = x.transformNode(s);
var destination = document.frames("main").document.open("text/html",
"replace");
destination.write(html);
}
</script>
</head>
<frameset onload="populateFrames()" rows="*,64">
<frame name="main" scrolling="yes">
<frame name="footer" scrolling="no" noresize target="main" src=http://www.webdeveloper.com/forum/archive/index.php/"legend.html">
</frameset>
</html>
--------------------------------------------------------------
Here is my XML document ("prime.xml")
<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="customers.xsl"?>
<database>
<element>
<transaction>
<day>Monday</day>
<time>2:00pm</time>
</transaction>
</element>
<element>
<customer>
<name>Dan Subaitani</name>
<order>Big Screen TV</order>
<price>$5000.00</price>
</customer>
</element>
<element>
<transaction>
<day>Wednesday</day>
<time>4:30pm</time>
</transaction>
</element>
<element>
<customer>
<name>Renato Guevara</name>
<order>laptop</order>
<price>$2000.00</price>
</customer>
</element>
<element>
<customer>
<name>Andrew Gabino</name>
<order>Keyboard</order>
<price>$20.00</price>
</customer>
</element>
<element>
<customer>
<name>Melody Heydari</name>
<order>Tablet PC</order>
<price>$400.00</price>
</customer>
</element>
</database>
------------------------------------------------------------------
Here is my XSL stylesheet ("customers.xsl")
<?xml version="1.0" encoding="ISO-8859-1" ?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl
utput method="html" indent="yes" /><xsl:template match="/database">
<html>
<head>
<title>clients</title>
<script type="text/javascript">
<![CDATA[
function show_hide()
{
var st1;
if(button1.value=="Hide Name")
{
st1="none";
button1.value="Show Name";
}
else
{
st1="block";
button1.value="Hide Name";
}
var tb1 = document.getElementById("main");
var rows1 = tb1.getElementsByTagName("tr");
for (var row=0; row<rows1.length; row++)
{
var cels = rows1[row].getElementsByTagName("td");
cels[0].style.display=st1;
}
}
function show_hide_tran()
{
var st1;
if(button2.value=="Hide Transactions")
{
st1="none";
button2.value="Display Transactions";
}
else
{
st1="block";
button2.value="Hide Transactions";
}
var tb2 = document.getElementById("main");
var rows2 = tb2.getElementsByTagName("tr");
var cels2 = rows2[0].getElementsByTagName("td");
for (var index=0; index<rows2.length; index++)
{
if (rows2[index].style.color == "blue")
{
rows2[index].style.display = st1;
}
}
}
]]>
</script>
</head>
<body>
<input type="button" id="button1" value="Hide Name" onClick="show_hide()"/>
<input type="button" id="button2" value="Hide Transactions" onClick="show_hide_tran()"/>
<table id="main" border="3" cellspacing="1" cellpadding="1">
<xsl:apply-templates select="element"/>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="element">
<xsl:apply-templates select="customer" />
<xsl:apply-templates select="transaction" />
</xsl:template>
<xsl:template match="customer">
<tr>
<td><xsl:apply-templates select="name"/></td>
<td><xsl:apply-templates select="order"/></td>
<td><xsl:apply-templates select="price"/></td>
</tr>
</xsl:template>
<xsl:template match="transaction">
<tr style="color:blue">
<td><xsl:apply-templates select="day"/></td>
<td colspan="2"><div><xsl:apply-templates select="time"/></div></td>
</tr>
</xsl:template>
</xsl:stylesheet>
-----------------------------------------------------------
and here is another HTML document("legend.html")
<html>
<head>
</head>
<body>
<input type="button" id="button1" value="Hide Name" onClick="renato()">
<input type="button" id="button2" value="Hide Transactions" onClick="guevara()">
</body>
</html>
------------------------------------------------
What I'm trying to do is have the buttons located in legend.html call the functions that are in the script from customers.xsl to control the table actions. I don't know how to call functions from one frame which was originally in xsl in another frame which is html. Thank you in advance. Any leads would be greatly appreciated.
Renato