Прокрутите до определенного элемента DataList в UserControl - PullRequest
Новая
       22

Прокрутите до определенного элемента DataList в UserControl

2 голосов
/ 14 июля 2011

Я работаю над приложением ASP.NET, в котором у меня есть 3 пользовательских элемента управления, встроенных в страницу aspx, которая, в свою очередь, использует главную страницу.

2 У пользовательских элементов управления из 3 есть DataList. Я хотел бы прокрутить до определенного / выбранного DataListItem в пользовательском контроле.

Кроме того, я посмотрел эту ветку (http://forums.asp.net/t/1596201.aspx). Но я не думаю, что она будет работать в моем случае. И у меня есть MaintainScrollPositionOnPostback = "true" на странице aspx - все равно не повезло.

Было бы очень полезно, если бы кто-нибудь помог мне найти способ сделать это

Разметка выглядит примерно так 

     <asp:DataList ID="dl" runat="server"
            SkinID="DataList" onitemcommand="dl_ItemCommand" 
            >
            <ItemTemplate>
                <asp:Label ID="lblIDTitle" runat="server" Text="ID: " />
                <asp:Label ID="dlLabel" runat="server" Text='<%# Eval("Id") %>'  />
                <asp:LinkButton ID="btnSelect" runat="server" CommandName="Select">Select</asp:LinkButton>
                <br />
                <asp:Label ID="NameLabel" runat="server" Text='<%# Eval("DisplayName") %>' />
                <br />
            </ItemTemplate>
        </asp:DataList>

Ответы [ 2 ]

2 голосов
/ 25 июля 2011

Похоже, это довольно просто. Вот шаги:

  • В пользовательский элемент управления, содержащий список данных, добавлен этот метод. 

     public void FocusControlOnPageLoad(string ClientID, System.Web.UI.Page page)
 {
     ClientScriptManager clientScript = this.Page.ClientScript;
     clientScript.RegisterClientScriptBlock(this.GetType(),"CtrlFocus",

                    @"<script> 

          function ScrollView()

          {
             var el = document.getElementById('" + ClientID + @"')
             if (el != null)
             {        
                el.scrollIntoView();
                el.focus();
             }
          }

          window.onload = ScrollView;

          </script>");

}

  • Как видно из разметки, у меня была кнопка ссылки. Поэтому с помощью OnItemCommand я вызывал эту функцию всякий раз, когда нажимали кнопку ссылки. Как то так; 

    protected void dlCommitment_ItemCommand(object source, DataListCommandEventArgs e)
{            
    if (e.CommandName == "Select")
    {  
        LinkButton link = LinkButton)dlCommitment.Items[e.Item.ItemIndex].FindControl("btnSelectCMTMT");
         FocusControlOnPageLoad(link.ClientID, this.Page);
    }
}

И это сработало как шарм. Благодаря посту, в котором обсуждается ScrollIntoView, и статье проекта кода о методе, который я опубликовал выше. Поскольку я спешу, я не могу прикрепить ссылки. Спасибо тем, кто разместил эту информацию изначально.

0 голосов
/ 14 июля 2011

Самый простой трюк будет, если у вас есть какой-либо фокусируемый HTML-элемент, такой как якорь или кнопка в списке данных, установите для него индекс табуляции равным нулю или используйте js для фокусировки на нем.

...