0

紛らわしいタイトルですが、私がそれを置くことができる最善の方法です。

基本的に、私は現在、さまざまなGridViewを含むoverflow：autoを持つ単一のdivを使用しています。GridViewは、MultiViewを使用して交換され、各個別のビューには単一のGridViewが含まれます。

切り替えられるビューに応じてdivのスクロール位置を設定できるように、各ビューのスクロール位置を保存できるようにしたいと思います。

これが私のページの設定方法です。

<div id="scrollingDiv" style="height:100%; overflow:auto;">
  <div id="gridWrap">

  <asp:UpdatePanel ID="UpdatePanel1" runat="server" RenderMode="Inline">
  <ContentTemplate>
    <asp:MultiView ID="MultiView1" runat="server">
      <asp:View ID="view1" runat="server">
        <asp:GridView ID="gridView1" runat="server">
        </asp:GridView>
      </asp:View>

      <asp:View ID="view2" runat="server">
        <asp:GridView ID="gridView2" runat="server">
        </asp:GridView>
      </asp:View>
    </asp:Multiview>
  </ContentTemplate>
  </asp:UpdatePanel>

  </div>
</div>

したがって、scrollingDivにはすべてのビューが含まれ、GridViewごとにスクロールします。

ビューを切り替えるには、ドロップダウンを接続します

protected void DropDownList_SelectedIndexChanged(object sender, EventArgs e)
{
    switch (DownList.SelectedItem.Value)
    {

        case "view1":
            MultiView1.SetActiveView(view1);
            break;
        case "view2":
            MultiView1.SetActiveView(view2);
            break;
    }
}

私は周りを見回していて、私のケースに固有の何かを見つけることができません。1つのオーバーフローdivだけを使用できるようにしたいのですが、ビューごとに個別のオーバーフローdivを作成する必要があるかどうかはわかります。

どんな助けでも素晴らしいでしょう、ありがとう。

4

1 に答える 1

1

jQueryといくつかの非表示フィールドが役立ちます。これを試して...

    <asp:Hiddenfield ID="hdnCurrentView" runat="server"/>
    <asp:Hiddenfield ID="hdnMultiView1Top" runat="server"/>
    <asp:Hiddenfield ID="hdnMultiView2Top" runat="server"/>

バックエンドで、つまりCSファイルで、現在のビューを非表示フィールドに設定します。

    protected void DropDownList_SelectedIndexChanged(object sender, EventArgs e)
    {
        switch (DownList.SelectedItem.Value)
        {
            case "view1":
                MultiView1.SetActiveView(view1);
                hdnCurrentView.Value = "View1";
                break;
            case "view2":
                MultiView1.SetActiveView(view2);
                hdnCurrentView.Value = "View2";
                break;
        }
    }

次に、jQueryready関数で

    $().ready(function() {

        //for storing scroll position of each view in respective hiddenfields
        $(window).scroll(function () {
          if ($("#hdnCurrentView").val() == "View1") {
             $("#hdnMultiView1Top").val($(window).scrollTop());
          }
          else if ($("#hdnCurrentView").val() == "View2") {
             $("#hdnMultiView2Top").val($(window).scrollTop());
          }
        });

        //for restoring scroll position on page load i.e., ready function in jQuery 
        if ($("#hdnCurrentView").val() == "View1") {
           $(window).scrollTop($("#hdnMultiView1Top").val());
        }
        else if ($("#hdnCurrentView").val() == "View2") {
           $(window).scrollTop($("#hdnMultiView2Top").val());
        }

    });

これにより、各マルチビューの垂直スクロール位置が維持されます。水平スクロール位置も維持したい場合は、ビューごとに非表示フィールドを用意し、以下に示すjQuery関数を使用してください。演習としてあなたに任せました...

    $(window).scrollLeft(value);

ハッピーコーディング...;）

于 2012-11-21T04:50:45.943 に答える