0

我创建了一个图片库，并使用以下过滤器对页面上显示的结果进行排序：

在此处输入图像描述

效果很好并且按预期过滤，直到我导航到分页中的另一个页面（.aspx?page=2）并且过滤器恢复为默认选项。我需要它来保存选定的选项并相应地显示过滤结果。

这是我正在使用的 XSLT 的一个片段，如果需要，我可以发布整个 XSLT：

    <xsl:variable name="FF_sortType" select="umbraco.library:RequestForm('sortType')" />
<xsl:variable name="FF_resultsPerPage" select="umbraco.library:RequestForm('resultsPerPage')" />        
<xsl:variable name="FF_details" select="umbraco.library:RequestForm('details')" />    
<xsl:variable name="FF_zoom" select="umbraco.library:RequestForm('zoom')" /> 

<!-- Filter the page results, Images per page, Most Recent/Alphabetical, Details On/Off, Zoom On/Off -->
<form action="#">
  <div class="imageGalleryAlbumFilter">
    <fieldset>
      <label>Images per page:</label>
      <select name="resultsPerPage" id="resultsPerPage" onchange="document.getElementById('BoostMasterForm').submit()" >
        <option value="8">
        <xsl:if test="$FF_resultsPerPage= '8'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        8 </option>
        <option value="20">
        <xsl:if test="$FF_resultsPerPage= '20'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        20 </option>
        <option value="40">
        <xsl:if test="$FF_resultsPerPage= '40'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        40 </option>
        <option value="60">
        <xsl:if test="$FF_resultsPerPage= '60'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        60 </option>
        <option value="80">
        <xsl:if test="$FF_resultsPerPage= '80'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        80 </option>
        <option value="100">
        <xsl:if test="$FF_resultsPerPage= '100'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        100 </option>
      </select>
    </fieldset>
    <fieldset>
      <label>Sort by:</label>
      <select name="sortType" id="sortType" onchange="document.getElementById('BoostMasterForm').submit()" >
        <option value="MostRecent">
        <xsl:if test="$FF_sortType= 'MostRecent'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        Most recent </option>
        <option value="Alphabetical">
        <xsl:if test="$FF_sortType= 'Alphabetical'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        Alphabetical </option>
      </select>
    </fieldset>
    <fieldset>
      <label>Details:</label>
      <select name="details" id="details" onchange="document.getElementById('BoostMasterForm').submit()" >
        <option value="On">
        <xsl:if test="$FF_details= 'On'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        On </option>
        <option value="Off">
        <xsl:if test="$FF_details= 'Off'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        Off </option>
      </select>
    </fieldset>
    <fieldset>
      <label>Zoom:</label>
      <select name="zoom" id="zoom" onchange="document.getElementById('BoostMasterForm').submit()" >
        <option value="On">
        <xsl:if test="$FF_zoom= 'On'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        On </option>
        <option value="Off">
        <xsl:if test="$FF_zoom= 'Off'">
          <xsl:attribute name="selected">selected</xsl:attribute>
        </xsl:if>
        Off </option>
      </select>
    </fieldset>
  </div>
</form>

<script type='text/javascript'>
$(document).ready(function() {
    $("#resultsPerPage").change(function() {
        $("#BoostMasterForm").attr("action", $(this).val());
        $("#BoostMasterForm").submit();
    });
    $("#sortType").change(function() {
        $("#BoostMasterForm").attr("action", $(this).val());
        $("#BoostMasterForm").submit();
    });
    $("#details").change(function() {
        $("#BoostMasterForm").attr("action", $(this).val());
        $("#BoostMasterForm").submit();
    });
    $("#zoom").change(function() {
        $("#BoostMasterForm").attr("action", $(this).val());
        $("#BoostMasterForm").submit();
    });
});​
</script>

如果有人可以提供帮助，将不胜感激。

干杯，合资企业

4

2 回答 2

0

umbraco.library 静态类有一堆用于管理会话和其他变量的助手。当您使用查询字符串进行导航时，不会提交表单，并且您在 XSLT 中的控件没有视图状态 - 在页面提交之间保留其值的能力。

有两种方法可以解决这个问题：

  1. 将您的画廊（或您的过滤器部分）重新编码为 ASP.NET 用户控件，并在控件上启用视图状态；
  2. 更改表单值时，在 Javascript 中手动构建一个字符串，其中包含每个控件的名称和值（或者，使用 Javascript 将值保存到 cookie 中）。然后，在分页时，要么在查询字符串的末尾添加 Javascript 字符串并umbraco.library:RequestQueryString("myparam")在 XSLT 中使用检索值，要么从 cookie 中检索值，umbraco.library.RequestCookies("myparam")然后确定在呈现选项时需要将哪些表单选项设置为“已选择” <select>。
于 2012-11-02T00:16:19.370 回答
0

有几种方法可以做到这一点，尽管使用用户控件会很慢并且难以维护。因此，我强烈建议不要为此使用用户控件。

您不需要视图状态，也不需要调用 umbraco 库。

您可以简单地使用宏属性并使用宏属性语法来捕获查询值。Umbraco 有几种方法可以解决这个问题，尽管没有多少人知道。

请注意，此解决方案还解决了基于请求变量的 umbraco 宏缓存可能遇到的任何问题。

在您的 XSLT 中，您使用参数来捕获宏值

<xslt:param name="numberofitems" select="/macro/numberofitems"/>

添加的宏属性应具有“numberofitems”/num​​ber 类型的别名。

然后在模板上调用你的宏中，添加以下行：

<umbraco:macro alias="mypagedmacro" numberofitems="[@numberofitems],[%numberofitems],10" />

现在使用请求变量 ?numberofitems=20 调用您的页面

这里会发生什么？

第一个值将来自请求变量“numberofitems”（在本例中为 20）。

如果这不可用，umbraco 将查看 cookie 以获取“numberofitems”，以防您将其保存在 cookie 中以供以后使用。

如果不可用，则默认值为 10。

将所有变量添加到宏中，您可以缓存此分页列表的所有不同情况。

有关宏语法的更多信息http://our.umbraco.org/wiki/reference/templates/umbracomacro-element/macro-parameters/advanced-macro-parameter-syntax

于 2014-05-19T08:22:04.377 回答