Hi all,
I am fairly new to XML in this sense. I am trying to load an XML file to HTML and add some sort of filtering functionality using XSL.
I have the following code that is working:
documentnameSort.xsl source:
Ultimately what I would like to do is have a drop-down menu for flitering purposes (for example filter on the document number documentNumberSort.xsl) to load a XSLT file to replace what I have displayed already in the documentNameSort.xsl file.
I currently have a button that loads the documentNumberSort.xsl but it adds the information below the existing information.
I know it is probably something that is easy to do but since my programming knowledge is low I am having a hard time with it.
Thanks everyone.
Brent
I am fairly new to XML in this sense. I am trying to load an XML file to HTML and add some sort of filtering functionality using XSL.
I have the following code that is working:
Code:
<HTML>
<head>
</head>
<BODY>
<script type="text/javascript">
function Apply_XSLT()
{
// Load XML file
var XMLDoc = new ActiveXObject("Msxml2.DOMDocument.3.0")
XMLDoc.async = false
XMLDoc.load("Subcontracts.xml")
// Load XSLT file
var XSLTDoc = new ActiveXObject("Msxml2.DOMDocument.3.0")
XSLTDoc.async = false
XSLTDoc.load("documentNumberSort.xsl")
document.all.XSLTOutput.innerHTML = XMLDoc.transformNode(XSLTDoc)
}
function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=anchors.length-1; i>=0; i--) {
var anchor = anchors[i];
if (anchor.href && anchor.href.substr(0,7) == "[URL unfurl="true"]http://")[/URL]
anchor.target = "_blank";
}
}
window.onload = externalLinks;
// Load XML
var xml = new ActiveXObject("Microsoft.XMLDOM")
xml.async = false
xml.load("Subcontracts.xml")
// Load the XSL
var xsl = new ActiveXObject("Microsoft.XMLDOM")
xsl.async = false
xsl.load("documentNameSort.xsl")
// Transform
document.write(xml.transformNode(xsl))
function selected(){
for (i=0;i<document.getElementsByTagName('select').length; i++) {
document.getElementsByTagName('select').item(i).selectedIndex=0;
}
}
</script>
<input type="button" value="Apply XSLT" onClick="Apply_XSLT()"/>
<div id="XSLTOutput"></div>
</body>
</html>
Code:
<?xml version="1.0" ?>
<xsl:stylesheet xmlns:xsl="[URL unfurl="true"]http://www.w3.org/TR/WD-xsl">[/URL]
<xsl:template match="/">
<html>
<body>
<table border="2" bgcolor="red">
<tr>
<th>Document Number</th>
<th>Document Name</th>
<th>Function</th>
<th>Document Type</th>
<th>Activity</th>
</tr>
<xsl:for-each select="documents/data" order-by="+ docName">
<tr>
<td>
<xsl:value-of select="docID" />
</td>
<td>
<a><xsl:attribute name="href">
<xsl:value-of select="docLink"/></xsl:attribute>
<xsl:value-of select="docName"/>
</a>
</td>
<td>
<xsl:value-of select="function" />
</td>
<td>
<xsl:value-of select="docType" />
</td>
<td>
<xsl:value-of select="activity" />
</td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>Ultimately what I would like to do is have a drop-down menu for flitering purposes (for example filter on the document number documentNumberSort.xsl) to load a XSLT file to replace what I have displayed already in the documentNameSort.xsl file.
I currently have a button that loads the documentNumberSort.xsl but it adds the information below the existing information.
I know it is probably something that is easy to do but since my programming knowledge is low I am having a hard time with it.
Thanks everyone.
Brent