|
[XSL-LIST Mailing List Archive Home]
[By Thread]
[By Date]
[Recent Entries]
[Reply To This Message]
Re: Dynamic processing of xml file using xsl and java
Subject: Re: Dynamic processing of xml file using xsl and javascript
From: Anton Triest <anton@xxxxxxxx>
Date: Fri, 29 Oct 2004 13:47:12 +0200
|
Hi Matthew,
xslStyleSheet.load(data.xsl);
xsltProcessor.importStylesheet(xslStylesheet);
XMLDocument.load is asynchronous, so importStylesheet will not work this
way (the file is not yet loaded). You must call it in an onload handler:
cfr. http://www.mozilla.org/projects/xslt/js-interface.html
This should work (tested in Firefox 1.0PR):
<script type="text/javascript" language="JavaScript">
var processor = new XSLTProcessor();
var dataXML = document.implementation.createDocument("", "", null);
dataXML.load("data.xml");
var dataXSL = document.implementation.createDocument("", "", null);
dataXSL.addEventListener("load", onload, false);
dataXSL.load("data.xsl");
function onload()
{
processor.importStylesheet(dataXSL);
}
function XSLTransform(outputElement)
{
var ownerDocument = document.implementation.createDocument("", "",
null);
var newFragment = processor.transformToFragment(dataXML,
ownerDocument);
var oldLink = document.getElementById("xsllink");
document.getElementById(outputElement).replaceChild(newFragment,
oldLink);
}
</script>
Cheers,
Anton
Matthew Hailstone wrote:
All,
I am trying to use an xsl:stylesheet and javascript to dynamic change
the content of a webpage. I have included all the files for completeness
so no fragments of files can be seen out of context. (That does not mean
that all the content here is correct. Obviously this is not working and
thus my post.) This is my best attempt of course, from everything I've
been able to salvage on the the topic from the resources I've found. :)
I also wanted people searching the web for answers to have a complete
example when finished of what I am trying to do.
Here are all the files:
contents.html
<html>
<head>
<script type=text/javascript>
var xmlDocName = data.xml;
var xmlDoc = document.implementation.createDocument(, , null);
var xmlLoaded = false;
function loadXML( filename )
{
var doc;
if (document.implementation && document.implementation.createDocument)
{
doc = document.implementation.createDocument(, , null);
}
else if (window.ActiveXObject)
{
doc = new ActiveXObject(Microsoft.XMLDOM);
}
else
{
alert('Your browser can\'t handle this script');
return;
}
doc.load(xmlDocName);
return doc;
}
function XSLTransform(outputElement)
{
var xslStylesheet;
var xsltProcessor = new XSLTProcessor();
// load the xml file, xmlURL, if not already loaded
if (!xmlLoaded)
{
//xmlDoc = loadXML( xmlDocName );
xmlDoc = document.implementation.createDocument(, , null);
xmlDoc.load(data.xml);
xmlLoaded = true;
};
// load the xsl file, xslURL
//xslStyleSheet = loadXML( data.xsl );
xslStyleSheet = document.implementation.createDocument(, , null);
xslStyleSheet.load(data.xsl);
xsltProcessor.importStylesheet(xslStylesheet);
// transform the xml against the xsl and save the output fragment
var fragment = xsltProcessor.transformToFragment(xmlDoc, document);
// replace the JS XSLTransform link with the output fragment
// by doing a dom replace of fragment against the original
// link (here represented as oldLink).
var oldLink = document.getElementById(xsllink);
document.getElementById(outputElement).replaceChild(fragment,oldLink);
}
</script>
</head>
<body>
<div>
<a href =javascript:XSLTransform('linkoutput')>Frame a</a><br>
</div>
<div id=linkoutput style=margin:1em><div
id=xsllink>Starting</div></div>
</body>
</html>
data.xml
<?xml version=1.0?>
<data>
<dn name='One'>
<attr name='bgcolor'>#8F8FBD</attr>
<attr name='first'>First Attribute</attr>
<attr name='second'>Second Attribute</attr>
<attr name='third'>Third Attribute</attr>
</dn>
<dn name='Two'>
<attr name='bgcolor'>#EBC79E</attr>
<attr name='first'>First Attribute</attr>
<attr name='second'>Second Attribute</attr>
<attr name='third'>Third Attribute</attr>
</dn>
<dn name='Three'>
<attr name='bgcolor'>#FFFFCC</attr>
<attr name='first'>First Attribute</attr>
<attr name='second'>Second Attribute</attr>
<attr name='third'>Third Attribute</attr>
</dn>
</data>
data.xsl
<?xml version=1.0?>
<xsl:stylesheet
xmlns:xsl=http://www.w3.org/1999/XSL/Transform
version=1.0>
<xsl:param name=dn>One</xsl:param>
<xsl:output method=html></xsl:output>
<xsl:template match=/>
<!--<html>-->
<xsl:apply-templates/>
<!--</html>-->
</xsl:template>
<xsl:template match=data>
<!--<body>-->
<h1>HI!</h1>
<div>
<xsl:attribute name=bgcolor>
<xsl:value-of select=dn[@name='One']/attr[@name='bgcolor']/>
</xsl:attribute>
</div>
<h1>Data</h1>
<!--</body>-->
</xsl:template>
</xsl:stylesheet>
Thanks!
Matthew
 |
PURCHASE STYLUS STUDIO ONLINE TODAY!
Purchasing Stylus Studio from our online shop is Easy, Secure and Value Priced!
Download The World's Best XML IDE!
Accelerate XML development with our award-winning XML IDE - Download a free trial today!
Subscribe in XML format
| RSS 2.0 |
|
| Atom 0.3 |
|
|
Cart
