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>

誰かが助けることができればそれは大いにありがたいです。

乾杯、JV

4

2 に答える 2

0

umbraco.library 静的クラスには、セッションおよびその他の変数を管理するための一連のヘルパーがあります。クエリ文字列を使用してナビゲートしているため、フォームは送信されず、XSLT 内のコントロールにはビューステート (ページ送信間で値を保持する機能) がありません。

これには 2 つの方法があります。

  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 に答える