XSL:使用动态选择列表生成筛选列表

时间:2012-05-18 21:28:52

标签: xslt recursion drop-down-menu

我有一个名称和电话号码的XML文件以及与之关联的城市(可能是多个城市)。我想要做的是生成一个唯一的城市列表,然后让用户选择其中一个城市。当他们这样做时,会显示与该城市相关联的所有名称的列表。

我可以生成唯一的城市列表。我可以生成与硬编码城市相关的名称。选择城市时,我可以使名称/电话列表可见或不可见。我不能做的是弄清楚如何使用选择列表“选择”值来过滤名称。我意识到这可能是微不足道的,但要善待新手并告诉我它是如何完成的!

这是我的代码:

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">

<html>
<head>

  <script type="text/javascript">
    var showList = function() {
    document.getElementById("swarms").style.visibility = "visible";
    <xsl:variable name="thisOne" select="'document.allCities.select.options[document.allCities.select.selectedIndex].value'" />
    }
  </script>
</head>

<body>

    <!-- Display list of cities -->
    <div id="city_list">
    <xsl:variable name="unique-list" select="swarmlist/member/cities/city[not(.=following::city)]" />

        <form name="allCities">
        <strong>Select A City and Click the Button to Display the List: </strong> 
        <select name="select">              
            <option value="all">All</option>
            <xsl:for-each select="$unique-list">
            <xsl:sort select="."/>
            <option>
            <xsl:attribute name="value"><xsl:value-of select="."/></xsl:attribute>
            <xsl:value-of select="."/>
            </option>
            </xsl:for-each>
        </select>
      <input name="submit" type="button" value="Display" onclick="showList();" />
    </form>
    </div>
    <!-- End of City list -->

    <!-- Display list of volunteers -->
   <table border="1" id="swarms" style="visibility:hidden">
     <tr bgcolor="#9acd32">
      <th>Name</th>
      <th>Phone</th>
    </tr>

    <xsl:for-each select="swarmlist/member">
    <xsl:choose>
       <xsl:when test="cities/city = $thisOne">
    <tr>
        <td><xsl:value-of select="name"/></td>
        <td><xsl:value-of select="phone"/></td>
    </tr>
    </xsl:when>
</xsl:choose>
  </xsl:for-each>
  </table>
  <!-- End of volunteer list -->

</body>
</html>
</xsl:template>
</xsl:stylesheet> 

1 个答案:

答案 0 :(得分:0)

您尝试根据Javascript表达式定义XSLT变量。据我所知,这是行不通的,因为在呈现页面之前,在执行任何Javascript之前处理 XSLT。换句话说,您无法使用XSLT根据用户操作动态更改页面内容。

您可以尝试将按钮更改为真实的<input type="submit">,并在用户对其进行陈述时让页面重新加载。这样,您可以将所选城市作为请求参数,并将其读入$thisOne变量。

我自己从未在XSLT中捕获过请求参数,但希望这可以帮助您: querystring using xslt

另一种更简单(效率极低)的方法是将整个列表解析为不同的<div>块,然后使用Javascript隐藏它们并显示正确的块。