Selected Tab not highlighted

[JSON]

Why does tab not highlight when selected? Added RadTab control to master page using NavigateURL redirection but selected tab does not highlight when selected as published demo does. Am I missing something or does this require additional coding?

 

 

<td style="background-color:#f0e68c; width:100%">

 

 

<telerik:RadTabStrip ID="RadTabStrip1" runat="server" Skin="Hay" Align="Justify" SelectedIndex="0">

 

 

<Tabs>

 

 

<telerik:RadTab Text="Search" NavigateUrl="~/Forms/Search.aspx">

 

 

</telerik:RadTab>

 

 

<telerik:RadTab Text="Incidents" NavigateUrl="~/Forms/Incidents.aspx">

 

 

</telerik:RadTab>

 

 

<telerik:RadTab Text="Unit Logs" NavigateUrl="~/Forms/UnitLogs.aspx">

 

 

</telerik:RadTab>

 

 

<telerik:RadTab Text="Rosters" NavigateUrl="~/Forms/Rosters.aspx">

 

 

</telerik:RadTab>

 

 

<telerik:RadTab Text="Assignments" NavigateUrl="~/Forms/Assignments.aspx">

 

 

</telerik:RadTab>

 

 

<telerik:RadTab Text="Activities" NavigateUrl="~/Forms/Activities.aspx">

 

 

</telerik:RadTab>

 

 

</Tabs>

 

 

</telerik:RadTabStrip>

 

 

<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

 

 

</asp:ContentPlaceHolder>

 

 

</td>

 

[Yana]

Hello Steve O'Neil,

This is expected behavior - when tabs have NavigateUrl set, the page just navigates and the clicked tab is not selected. You can find the clicked tab in Page_Load event of the master page and select it like this:

RadTab currentTab = RadTabStrip1.FindTabByUrl(Request.Url.PathAndQuery);
if (currentTab != null) currentTab.Selected = true;

Regards,
Yana
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[JSON]

Yana,

Works Great and Thank you,

Steve O.

[DanielC Fields]

Hi, I am a newbie at all this, and I am having the same issue as user Steve O'neill, the thing is that I am just starting with ASP.NET and VB, and I tried to impliment the solution Yana gave but I was not succesful, can someone one help me on this?
Does that solution look like C# maybe?? what would it be for VB? If not, would anybody help me to make my tabs get selected? Thank you so much and I apologize for any incovenience. Best regards

Oh by the way: on my "masterpage.master.vb" I get this: (I hope this is useful :-()

 

 

Protected Sub RadTabStrip1_TabClick(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadTabStripEventArgs) Handles RadTabStrip1.TabClick

 

 

 

 

End Sub

 

[DanielC Fields]

SOLVED!!!!!

I made it work, I just used an online C# to vb.net converter and I got this:

Dim currentTab As RadTab = RadTabStrip1.FindTabByUrl(Request.Url.PathAndQuery)
If (Not (currentTab) Is Nothing) Then
    currentTab.Selected = true
End If

But after doing that I kept getting an error saying that RadTab was not declared, the thing is that I had to import the following: 

Imports Telerik.Web.UI

and it worked like a charmed !!!!

So the whole code ended up like this:

Imports Telerik.Web.UI

Partial Class MasterPage
    Inherits System.Web.UI.MasterPage

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load, RadTabStrip1.Load
        Dim currentTab As RadTab = RadTabStrip1.FindTabByUrl(Request.Url.PathAndQuery)
        If (Not (currentTab) Is Nothing) Then
            currentTab.Selected = True
        End If
    End Sub

Regards!!!!!

[d-cpt]

Hi Yana,

I have several pages as content pages under each tab. I can get the tab selected when I navigate to the page I listed under NavigateUrl property. However the other content pages don't get selected for the same tab.

May you give tips here to handle this case.

Thanks,

DT

[Yana]

Hi DT,

I cannot understand exactly the scenario,  please explain in more details and send us some simple code. Thanks in advance

Regards,
Yana
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[d-cpt]

Hi,

This is the scenario. I have a master page that has a telerik:RadTab and a contentplaceholder for content pages
<telerik:RadTabStrip ID="rtabSRFields" runat="server" AutoPostBack="True" Width="100%" >
 <Tabs>
         <telerik:RadTab runat="server" Value="radtabAdmission" Text="School Admissions"
                      NavigateUrl="~/admission/admission.aspx" SelectedIndex="0" />
         <telerik:RadTab runat="server" Value="radtabAdvising" Text="Advising"
                      NavigateUrl="~/advising/advising.aspx" SelectedIndex="1" />  
 </Tabs>
</telerik:RadTabStrip>
<asp:ContentPlaceHolder id="cphMain" runat="server" />

Under advising folder, I have advising.aspx as the first page and record.aspx as the second one.
When click Next on advising.aspx, the second page record.aspx will be shown.
I like to get the radtabAdvising selected when record.aspx is shown.

I tried this code on master page but it does not work for the record.aspx page:

RadTab

 

tab = this.rtabSRFields.FindTabByUrl(Request.Url.PathAndQuery);

 

 

if (tab != null)

 

{

tab.Selected =

true;

 

 

}

 

So back to my question is how I can get a particular tab selected for the pages that are not specified on NavigateUrl property.

Please give me soem hints/tips.

Sincerely,

Duc

[Yana]

Hi Duc,

I'm still not sure whether I understand the scenario - you have a second tabstrip inside the content page? Can you please send us some simple code illustrating this?

Sincerely yours,
Yana
the Telerik team

[d-cpt]

Hi Yana,

I appology for my clumsiness.
I've attached my sample pages. When the site loads, page B1 is the default so its tab "Tab B" is selected. When I click the link on B1.aspx to open page B2, I would like to get "Tab B" is selected. May you give me some tip to achieve this.

Thank you.

Duc

Master page:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Master.master.cs" Inherits="Master" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server"><title></title></head>
<body>
  <form id="form1" runat="server">
    <asp:ScriptManager ID="RadScriptManager1" runat="server"></asp:ScriptManager>   
    <h3>My RadTab</h3>   
    <div style="width:60%">   
      <telerik:RadTabStrip ID="RadTabStrip1" runat="server">
        <Tabs>       
            <telerik:RadTab runat="server" Value="rtab1" Text="Tab A" NavigateUrl="~/A/A.aspx" SelectedIndex="0" />           
            <telerik:RadTab runat="server" Value="radtabAdvising" Text="Tab B" NavigateUrl="~/B/B1.aspx" SelectedIndex="1" />           
        </Tabs>
      </telerik:RadTabStrip>     
      <div style="border-color: Silver; border-style:solid; border-width:1px;">
        <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server"></asp:ContentPlaceHolder>
      </div>
    </div>
  </form>
</body>
</html>

master.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;

public partial class Master : System.Web.UI.MasterPage
{
    protected void Page_Load(object sender, EventArgs e)
    {
      RadTab tab = this.RadTabStrip1.FindTabByUrl(Request.Url.PathAndQuery);
      if (tab != null)
      {
        tab.Selected = true;
      }
    }
}

B1.aspx:
<%@ Page Title="" Language="C#" MasterPageFile="~/Master.master" AutoEventWireup="true" CodeFile="B1.aspx.cs" Inherits="B_B1" %>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
  <div style="background-color:#CCD7CE; padding:2%">
    <h5>Page B1</h5>
    <br /><br />
    <asp:LinkButton ID="LinkButton1" runat="server"  PostBackUrl="~/B/B2.aspx">Click here to go to page B2</asp:LinkButton>
  </div>
</asp:Content>


B2.aspx:
<%@ Page Title="" Language="C#" MasterPageFile="~/Master.master" AutoEventWireup="true" CodeFile="B2.aspx.cs" Inherits="B_B2" %>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
  <div style="background-color:#EAE8DC; padding:2%">
    <h5>Page B2</h5>
    <br /><br />
    <asp:LinkButton ID="LinkButton1" runat="server"  PostBackUrl="~/B/B1.aspx">Click here to go back to page B1</asp:LinkButton>
  </div>
</asp:Content>

A.aspx:
<%@ Page Title="" Language="C#" MasterPageFile="~/Master.master" AutoEventWireup="true" CodeFile="A.aspx.cs" Inherits="A_A" %>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
  <div style="background-color:#EAE8DC; padding:2%">
  <h4>Page A</h4>
  <div>"Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium qui dolo ariatur?"</div>
  </div>
</asp:Content>

[Yana]

Hello,

I've attached my test pages based on your code to show how to select the tab in this case. I hope this helps.

Kind regards,
Yana
the Telerik team

[d-cpt]

Yana,

Thank you for the sample. It works great.

SIncerely,

DT

[Paul]

Hi Yana,

I can't get this to work, when I'm adding child pages to the RadTabStrip. I would like the tabstrip to "stay down", when one of the child pages are selected and the child should be marked as selected as well. 

Here is the code of the master page, 
<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="testMaster.master.vb" Inherits="TestMaster.testMaster" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" href="Site.css" type="text/css" media="screen" />

                
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <telerik:RadScriptManager ID="RadScriptManager1" Runat="server">
        </telerik:RadScriptManager>
        <telerik:RadTabStrip ID="RadTabStrip1" runat="server" Skin="Silk" EnableEmbeddedSkins="False"><Tabs>
                    <telerik:RadTab runat="server" Text="test1" NavigateUrl="~/test1.aspx">
                        <Tabs>
                            <telerik:RadTab runat="server" NavigateUrl="~/barn.aspx" Text="Child RadTab 1">
                            </telerik:RadTab>
                            <telerik:RadTab runat="server" NavigateUrl="~/barn2.aspx" Text="Child RadTab 2">
                            </telerik:RadTab>
        
                        </Tabs>
                    </telerik:RadTab>
                    <telerik:RadTab runat="server" Text="test2" NavigateUrl="~/Test2.aspx">
                    </telerik:RadTab>
                    <telerik:RadTab runat="server" Text="test3" ClientIDMode="AutoID" NavigateUrl="~/test3.aspx">
                    </telerik:RadTab>
                </Tabs>
            </telerik:RadTabStrip>
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </div>
    </form>
</body>
</html> 


And the code behind:
Imports Telerik.Web.UI
Public Class testMaster
    Inherits System.Web.UI.MasterPage

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load, RadTabStrip1.Load
        Dim currentTab As RadTab = RadTabStrip1.FindTabByUrl(Request.Url.PathAndQuery)
        If (Not (currentTab) Is Nothing) Then
            currentTab.Selected = True
        End If
    End Sub
   
End Class

Thanks,
Sofie 

[Ivan Danchev]

Hello Sofie,

If you want to keep the selected state of the tab when you click on it, please review the vb code-behind of this RadTabStrip demo. It demonstrates how to keep the state, that is normally lost with the page redirect.

Regards,
Ivan Danchev
Telerik