All geek questions in one place

AjaxToolkit: last TabContainer on the page is focused on page loading

I use more than one TabContainer per page in an ASP.NET project, and I noticed a very strange behavior: when the page loads, the focus moves to the last TabContainer on the page, causing it to scroll down. I don’t pay attention to any control, so I don’t understand where it comes from. I also switched places between the controls, and this is always the last one that is focused. TabContainers don't have any fancy settings, this is basically what they look like:

<cc1:TabContainer ID="tabContainer" runat="server"> <cc1:TabPanel runat="server" HeaderText="Header1" ID="tabPanel1" TabIndex="0"> <HeaderTemplate> <asp:Label ID="lblTab1" runat="server" Text="Tab1"></asp:Label> </HeaderTemplate> <ContentTemplate> ... (anything goes here, it still doesn't work) </ContentTemplate> </cc1:TabPanel> <cc1:TabPanel runat="server" HeaderText="Header2" ID="tabPanel2" TabIndex="1"> <HeaderTemplate> <asp:Label ID="lblTab2" EnableViewState="False" runat="server" Text="Tab2"></asp:Label> </HeaderTemplate> <ContentTemplate> ... (anything goes here, it still doesn't work) </ContentTemplate> </cc1:TabPanel> </cc1:TabContainer>

I know that I can focus on the control, I tried it, but first the page scrolls into the tab container and then returns to the focused control (this doesn’t look very good). I tried this to set focus to another control:

 <body id="main" onload="javascript:document.getElementById('lnkLogout').focus();">

Is this the standard behavior for TabContainer? How can I get rid of it?

+6
source share
5 answers

Put the script below to the right after the ScriptManager control:

 <script type="text/javascript"> Sys.Extended.UI.TabContainer.prototype._app_onload = function (sender, e) { if (this._cachedActiveTabIndex != -1) { this.set_activeTabIndex(this._cachedActiveTabIndex); this._cachedActiveTabIndex = -1; var activeTab = this.get_tabs()[this._activeTabIndex]; if (activeTab) { activeTab._wasLoaded = true; //activeTab._setFocus(activeTab); -- disable focus on active tab in the last TabContainer } } this._loaded = true; } </script>
+6
source

You can set the server-side focus to avoid page skipping.

Try this in Page_Load:

 PageUtility.SetFocus(foo);

Also check if the Page.MaintainScrollPositionOnPostback parameter is configured.

Let me know if this helps.

UPDATE - you can simply call .Focus () for any control that you want to be in focus by default.

for example: YourControlToFocus.Focus ()

0
source

Try it. It helps me:

 window.Sys.Application.findComponent('<%=tabContainer.ClientID %>'); tabContainer.set_activeTabIndex(1); ( //Here set the id of the last tab that is the index of the last tab. Index will start with 0 upto last - 1 as in array.. )
0
source

This is an old thread, but it was never allowed - here or in any other I found - and I had the same problem.

I fixed it by putting my javascript in the body element: onload="scrollTo(0,0);"

0
source

I had a similar problem, but I found a simpler solution.

In case you use:

 <asp:toolkitscriptmanager ID="ScriptManager1" runat="server"> </asp:toolkitscriptmanager>

and more panels in the tab container (e.g. 3):

 <asp:tabcontainer runat="server" ID="tc1" ActiveTabIndex="0" > <asp:TabPanel runat="server" ID="TB1" Height="250" > <asp:TabPanel runat="server" ID="TB1" Height="250" > <asp:TabPanel runat="server" ID="TB1" Height="250" >

For example, you can use the property:

  ActiveTabIndex="0"

OR

 tc1.ActiveTabIndex = 2 'code behind

Where an integer is the identifier of the tab you want to focus on.

It works for me! I hope I can help someone!

Enjoy

0
source

Source: https://habr.com/ru/post/916895/

More articles:


All Articles