The plugins site is currently in development.
We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.
Transform
The Transform plugin enables users to easily make cross-browser XML transformations with XSL. The plugin does not rely on additional libraries and utilizes all ajax options. Very flexible and easy to use.
Transform features include:
- Asynchronous or non-asynchronous calls
- Multiple asynchronous transformations at once
- Pass an object or html for a loading message while xml and xsl is retrieved
- Automatically transform element by providing a custom transform attribute to the element
- Supports passing ajax objects for xml and xsl retrieval
- Request data from URL or pass as string
- Works with xsl:import and xsl:include (even Safari and Chrome)
- Pass custom parameter values to XSL and callback functions
- Custom handlers for 'success', 'error', and 'complete'
- Non-asynchronous calls return transformed HTML
- Option to append XML and XSL as a data island
- Works with selectors
- No ActiveX objects
- Tested in IE6/8, Firefox3, Opera 9, Safari 3, Chrome, Netscape 8, and Flock
Examples: - More available in download
//Simple request for element with id="result"
$("#result").transform({xml:"file.xml",xsl:"file.xsl"});
-or-
$.transform({el:"#result",xml:"file.xml",xsl:"file.xsl"});
//With XSL parameter
$("#result").transform({
xslParams:{name:"value"},
xml:"file.xml",xsl:"file.xsl"
});
//Non-async returns HTML
var html = $.transform({async:false,xml:"file.xml",xsl:"file.xsl"});
//Custom handlers
$("#result").transform({
success:someFunc,error:someFunc,complete:someFunc,
xml:"file.xml",xsl:"file.xsl"
});
//Pass XML and XSL as string
$("#result").transform({xslstr:[xsl string], xmlstr:[xml string]});
//Use transform attribute to transform on load with msg
<div transform='{xml:"file.xml",xsl:"file.xsl",msg:$("#loadingmsg")}'></div>
//Request xml from web service by using an ajax object for the xml instead of file name
$("#result").transform({
xml:{
url:"service.asmx/AddTogether",
data:{
y:$("#y").val(),
x:$("#x").val()
},
type:"POST",
dataType:"xml"
},
xsl:"xsl/service.xsl"
});
Workarounds - Getting cross-browser support meant making some unique modifications to the script. If you have any issues with the plugin this is a good place to look for issues.
- The href property of xsl:import and xsl:include elements are converted to fully qualified urls. This function may not work for all scenarios.
- Safari and Chrome do not support xsl:import and xsl:include. To simulate this, the transform plugin loops through all included/imported xsl files and loads them through a non-asyncronous ajax call. Templates and parameters within those files are then loaded into the main stylesheet ignoring any duplicates and the import/include node is removed. Any import/include files which have another import/include reference should still work, but has not really been tested.
- IE implementation would not set parameters in an imported/included file (result of not using ActiveX). Any included parameters are added and set if they are missing in the main xsl file.
- When using the server transform file you must set values in the $.transform_config object. These values are not set dynamically and identify the language (asp or php), path to the server transform file, and path from the javascript file to the page.
*Please send any questions or comments about this plugin to info@daersystems.com
