自定義ASP.NET控件中的Begin / EndRequestHandler多個處理程序

Question

我有一個自定義ASP.NET控制，下拉/樹狀，其需要添加開始（端值）RequestHandlers防止UpdatePanel的期間滾動到容器的頂部部分回發（如所描述的在這里 ）。 它們是動態添加的，如下所示：

Page.ClientScript.RegisterStartupScript(this.GetType(), this.ClientID, string.Format(@"
                  var xPos, yPos;
                  var prm = Sys.WebForms.PageRequestManager.getInstance();

                  function BeginRequestHandler(sender, args) {{
                    if ($get('{0}') != null) {{
                      // Get X and Y positions of scrollbar before the partial postback
                      xPos = $get('{0}').scrollLeft;
                      yPos = $get('{0}').scrollTop;
                    }}
                 }}

                 function EndRequestHandler(sender, args) {{
                     if ($get('{0}') != null) {{
                       // Set X and Y positions back to the scrollbar
                       // after partial postback
                       $get('{0}').scrollLeft = xPos;
                       $get('{0}').scrollTop = yPos;
                     }}
                 }}

                 prm.add_beginRequest(BeginRequestHandler);
                 prm.add_endRequest(EndRequestHandler);  ", this.ItemsContainer.ClientID), true);

當我向頁面添加多個控件實例時，問題就開始了。 兩個腳本都被渲染和注冊但最終只有一個，頁面上的最后一個，最終附加到容器，即。 在面板X或Y中有更新的地方，只執行面板Y的JS - 兩次！

一個更好的選擇肯定會只附加一對Begin / End處理程序，我可以執行這些處理程序，例如，為RegisterStartupScript方法添加一個靜態鍵。 唯一的問題是我需要傳遞面板的參數以便當前更新UpdatePanel。

知道如何做到這一點，並與上述相結合？

Answer 1

此修改會自動恢復所有面板的滾動位置。

<script type="text/javascript">
    (function () {
        var scrolledDivs = [];
        var prm = Sys.WebForms.PageRequestManager.getInstance();

        prm.add_beginRequest(function (sender, args) {

            //store the scroll positions of all "scrolled" div elements
            //UpdatePanel and Panel both are div elements
            scrolledDivs = [];

            $('div').each(function () {
                var div = $(this);
                if (div.scrollLeft() != 0 || div.scrollTop() != 0) {
                    scrolledDivs.push({
                        element: this,
                        scrollLeft: div.scrollLeft(),
                        scrollTop: div.scrollTop()
                    });
                }
            });
        });

        prm.add_endRequest(function (sender, args) {
            //restore scroll positions
            $.each(scrolledDivs, function (index, value) {
                $(value.element).scrollLeft(value.scrollLeft).scrollTop(value.scrollTop);
            });
        });
    })();
</script>

注意：您需要包含JQuery

Answer 2

使用LostInComputer中的位修改代碼，解決方案如下所示：

            Page.ClientScript.RegisterStartupScript(this.GetType(), "scrollRestorer", @"
                  var scrolledDivs = [];
                  var prm = Sys.WebForms.PageRequestManager.getInstance();

                  function BeginRequestHandler(sender, args) {
                    //store the scroll positions of all 'scrolled' div elements
                    //UpdatePanel and Panel both are div elements
                    scrolledDivs = [];

                    $('div').each(function () {
                        var div = $(this);
                        if (div.scrollLeft() != 0 || div.scrollTop() != 0) {
                            scrolledDivs.push({
                                element: this.id,
                                scrollLeft: div.scrollLeft(),
                                scrollTop: div.scrollTop()
                            });
                        }
                    });
                 }

                 function EndRequestHandler(sender, args) {
                    //restore scroll positions
                    $.each(scrolledDivs, function (index, value) {
                        $('#' + value.element).scrollLeft(value.scrollLeft).scrollTop(value.scrollTop);
                    });
                 }

                 prm.add_beginRequest(BeginRequestHandler);
                 prm.add_endRequest(EndRequestHandler);  ", true);

項目本身不能存儲在數組中，只應存儲ID。