在 XSL 中实现用户筛选,折腾了好久,总算是搞定了
功能需求:
有如下 xml ,拟做一个 XSL 文件做解析,解析的效果是在解析后的页面下,有个DropdownList ,它列出所有的Group/@name值,允许用户通过选择来筛选XSL最终展示出来的数据
<?xml-stylesheettype="text/xsl" href="filter.xsl"?>
<root>
<groupname="group1">
<itemid="1">item 1</item>
<itemid="2">item 2</item>
</group>
<groupname="group2">
<itemid="1">item a</item>
<itemid="2">item b</item>
</group>
</root>
达到这个效果的 filter.xsl 文件如下:
<?xmlversion="1.0"?>
<xsl:stylesheetversion="1.0"xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:outputmethod="xml"indent="yes"/>
<xsl:templatematch="/">
<html>
<head>
<metacontent="text/html"http-equiv="Content-Type"></meta>
<scriptlanguage="javascript"name="Filter">
<![CDATA[
function filter_group(sName) {
var iXml = document.XMLDocument;
var iXsl = document.XSLDocument;
var iPara = iXsl.selectSingleNode('//xsl:param[@name="GroupName"]/@select');
iPara.value = "'" + sName + "'";
var iHtml = iXml.documentElement.transformNode(iXsl);
Layer_Display.innerHTML = iHtml;
}
]]>
</script>
</head>
<body>
<table>
<tr>
<td>
<formstyle="BORDER: 0">
<selectid="frm_Server">
<optionvalue=""><![CDATA[<- Please Select ->]]></option>
<xsl:for-eachselect ="root/group/@name">
<xsl:sortselect ="."/>
<option>
<xsl:attributename ="value">
<xsl:value-ofselect="."/>
</xsl:attribute>
<xsl:iftest="position() =1">
<xsl:attributename ="selected">1</xsl:attribute>
</xsl:if>
<xsl:value-ofselect="."/>
</option>
</xsl:for-each>
<optionvalue="*"><![CDATA[<- ALL ->]]></option>
</select>
<buttononClick="filter_group(this.form.frm_Server.value)">Query</button>
</form>
</td>
</tr>
<tr>
<td>
<divid="Layer_Display">
<xsl:apply-templatesselect="root"/>
</div>
</td>
</tr>
</table>
</body>
</html>
</xsl:template>
<xsl:templatematch="root">
<xsl:paramname="GroupName"select ="(group/@name)[1]"/>
<xsl:apply-templatesselect="group[@name=$GroupName or $GroupName = '*']"/>
</xsl:template>
<xsl:templatematch="group">
<table>
<thead>
<tr>
<th>id</th>
<th>value</th>
</tr>
</thead>
<tbody>
<xsl:for-eachselect="item">
<tr>
<td>
<xsl:value-ofselect="@id"/>
</td>
<td>
<xsl:value-ofselect="."/>
</td>
</tr>
</xsl:for-each>
</tbody>
</table>
</xsl:template>
</xsl:stylesheet>