Load aspx different page each tab

[Albert]

In my application I have one form called [Main.aspx] :

In this page i put one tab strip called [RadTab1] and it have following tabs :

1.Home 

2.Abouut Us

3.Contact Us

4.Feedback

Now what I want is when user click on Home tab at that time Home.aspx will be load under corrosponding page view...

When click on abount us then AboutUs.aspx ,similarly for other two..

I do no want to do this with master page and user controls..every thing should be in Main.aspx.

I have tried following code but it redirect me to another page .

<telerik:RadTabStrip ID="radTabMain" runat="server" Width="100%" MultiPageID="RadMultiPage1"

            SelectedIndex="0">

            <Tabs>

                <telerik:RadTab Text="Home" NavigateUrl="Home.aspx" runat="server">

                </telerik:RadTab>

                <telerik:RadTab Text="AbouutUs" NavigateUrl="AbouutUs.aspx" runat="server">

                </telerik:RadTab>

                <telerik:RadTab Text="Contact Us" NavigateUrl="Contact.aspx" runat="server">

                </telerik:RadTab>

                <telerik:RadTab Text="Feedback" NavigateUrl="Feedback.aspx" runat="server">

                </telerik:RadTab>

            </Tabs>

</telerik:RadTabStrip>

<telerik:RadMultiPage runat="server" ID="RadMultiPage1" SelectedIndex="0">

            <telerik:RadPageView  ID="RadPageView1" runat="server">

            </telerik:RadPageView>

            <telerik:RadPageView ID="RadPageView2" runat="server">

            </telerik:RadPageView>

            <telerik:RadPageView ID="RadPageView3" runat="server">

            </telerik:RadPageView>

            <telerik:RadPageView runat="server" ID="RadPageView1">

            </telerik:RadPageView>

</telerik:RadMultiPage>

So what ot do in this case ?

Please help me. Please send me code for this.

-Thanks
Albert

[Veronica]

Hi Albert,

You can use an iframe control and load the different pages through code-behind on TabClick event. Also you can save the Url for each tab in a custom attribute. Here's the code:

ASPX:

<telerik:RadTabStrip ID="radTabMain" runat="server" Width="100%" OnTabClick="radTabMain_TabClick">
            <Tabs>
                <telerik:RadTab Text="Home" runat="server" Url="Home.aspx">
                </telerik:RadTab>
                <telerik:RadTab Text="AboutUs" runat="server" Url="AboutUs.aspx">
                </telerik:RadTab>
                <telerik:RadTab Text="Contact Us" runat="server" Url="ContactUs.aspx">
                </telerik:RadTab>
                <telerik:RadTab Text="Feedback" runat="server" Url="Feedback.aspx">
                </telerik:RadTab>
            </Tabs>
        </telerik:RadTabStrip>
        <iframe id="frame1" width="100%" height="300" runat="server">
            <p>
                Your browser does not support iframes.</p>
        </iframe>

C#:

protected void radTabMain_TabClick(object sender, Telerik.Web.UI.RadTabStripEventArgs e)
    {
        frame1.Attributes["src"] = e.Tab.Attributes["Url"];
    }

Hope this helps.

All the best,
Veronica Milcheva
the Telerik team

[Charles]

Try doing it this way..

<telerik:RadTabStrip ID="radTabMain" runat="server" Width="100%" MultiPageID="RadMultiPage1"
            SelectedIndex="0">
            <Tabs>
                <telerik:RadTab Text="Home" runat="server">
                </telerik:RadTab>
                <telerik:RadTab Text="AbouutUs" runat="server">
                </telerik:RadTab>
                <telerik:RadTab Text="Contact Us" runat="server">
                </telerik:RadTab>
                <telerik:RadTab Text="Feedback"  runat="server">
                </telerik:RadTab>
            </Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage runat="server" ID="RadMultiPage1" SelectedIndex="0">
            <telerik:RadPageView  ID="RadPageView1" runat="server"  ContentUrl="Home.aspx">
            </telerik:RadPageView>
            <telerik:RadPageView ID="RadPageView2" runat="server" ContentUrl="AboutUs.aspx">
            </telerik:RadPageView>
            <telerik:RadPageView ID="RadPageView3" runat="server" ContentUrl="....">
            </telerik:RadPageView>
            <telerik:RadPageView runat="server" ID="RadPageView1" ContentUrl="....">
            </telerik:RadPageView>
</telerik:RadMultiPage>

I had mine like that and it works.

[Hai Feng Ma]

I configured these Content Urls, but it does not work for me.

[Princy]

Hello,

Try the following code snippet to achieve your scenario.

ASPX:

<telerik:RadTabStrip ID="radTabMain" runat="server" Width="100%" MultiPageID="RadMultiPage1" SelectedIndex="0">
  <Tabs>
     <telerik:RadTab Text="Home" runat="server" PageViewID="RadPageView1">
     </telerik:RadTab>
     <telerik:RadTab Text="AboutUs" runat="server" PageViewID="RadPageView2">
     </telerik:RadTab>
     <telerik:RadTab Text="Contact Us" runat="server" PageViewID="RadPageView3">
     </telerik:RadTab>
     <telerik:RadTab Text="Feedback" runat="server" PageViewID="RadPageView4">
     </telerik:RadTab>
  </Tabs>
</telerik:RadTabStrip>
<telerik:RadMultiPage runat="server" ID="RadMultiPage1" SelectedIndex="0">
  <telerik:RadPageView ID="RadPageView1" runat="server" ContentUrl="Home.aspx" Selected="true">
  </telerik:RadPageView>
  <telerik:RadPageView ID="RadPageView2" runat="server" ContentUrl="AboutUs.aspx">
  </telerik:RadPageView>
  <telerik:RadPageView ID="RadPageView3" runat="server" ContentUrl="ContactUs.aspx">
  </telerik:RadPageView>
  <telerik:RadPageView runat="server" ID="RadPageView4" ContentUrl="FeedBack.aspx">
  </telerik:RadPageView>
</telerik:RadMultiPage>

Please elaborate your scenario if it doesn't helps.

Regards,
Princy.

[Varalakshmi]

Hi ,

I have tried using radtabstrip (same code) inside radwindow. when i add tabstrip inside window, page_load events for Home.aspx triggered twice. is it known issue? or is there any workaround for this?

Code: Default.aspx

<telerik:RadWindow ID="win" runat="server" VisibleOnPageLoad="true">
                <ContentTemplate>
                    <telerik:RadTabStrip ID="radTabMain" runat="server" Width="100%" OnTabClick="radTabMain_TabClick">
                        <Tabs>
                            <telerik:RadTab Text="Home" runat="server" Url="Home.aspx">
                            </telerik:RadTab>
                        </Tabs>
                    </telerik:RadTabStrip>
                    <iframe id="frame1" width="100%" height="300" runat="server">
                        <p>
                            Your browser does not support iframes.
                        </p>
                    </iframe>
                </ContentTemplate>
            </telerik:RadWindow>

Home.aspx:

protected void Page_Load(object sender, EventArgs e)
    {
        lbl.Text = "loaded in iframe";
    }
    protected void Page_UnLoad(object sender, EventArgs e)
    {

    }

[Vessy]

Hi Varalakshmi,

When the RadWindow's VisibleOnPageLoad="true" property is set, the control is reloading its content on every full Postback, like the one performed when a tab is clicked. Bаbasically, the Home.aspx page is requested two times:
- Once, when the tab is clicked
- Once then the Window is reloaded due to the Postback performed by the clicked tab

In order to avoid this behavior, you can consider disabling the AutoPostback of the TabStrip and change the src of the iframe in its OnClientTabClicked handler:
https://docs.telerik.com/devtools/aspnet-ajax/controls/tabstrip/client-side-programming/events/onclienttabselected

Regards,
Vessy
Progress Telerik