Select Maintab and Maintabpage from Child page

8 posts, 1 answers
  1. nazeer
    nazeer avatar
    27 posts
    Member since:
    May 2009

    Posted 06 Feb 2012 Link to this post

    Hi Telerik Team,

    How to select maintab and maintabpage from Child page.

    For Example:
    I am having MainContentPage.aspx page inside this i have my Tabstrip and MultiPage hierarchy as mentioned below.

    <

    telerik:RadTabStrip ID="RadToolTabs" SelectedIndex="0" runat="server" MultiPageID="radMultiPage">

         <Tabs>

             <telerik:RadTab runat="server" Text="Products " SelectedIndex="0">

                 <Tabs>

                     <telerik:RadTab Text=" Lux " SelectedIndex="0"></telerik:RadTab>

                     <telerik:RadTab Text=" Santoor "></telerik:RadTab>

                 </Tabs>

             </telerik:RadTab>

             <telerik:RadTab runat="server" Text=" ProductPrice " >
            </telerik:RadTab>

         </Tabs>

     </telerik:RadTabStrip>

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

         <telerik:RadPageView ID="RadPageView1" runat="server" Height="500px" ContentUrl="Products.aspx"></telerik:RadPageView>

         <telerik:RadPageView ID="RadPageView2" runat="server" Height="500px" ContentUrl="Lux.aspx"></telerik:RadPageView>

         <telerik:RadPageView ID="RadPageView3" runat="server" Height="500px" ContentUrl="Santoor.aspx"></telerik:RadPageView>

         <telerik:RadPageView ID="RadPageView4" runat="server" Height="500px" ContentUrl="ProductPrice.aspx"></telerik:RadPageView>

     </telerik:RadMultiPage>

      

    When MainContentPage.aspx page loads, By default the Products tab, Lux tab Selected and Lux.aspx page loaded.
    and i am having GoProdcutPrice button in my Lux.aspx Page(Childtab page) , When i click on this button i have to select ProductPrice.aspx page and ProductPrice tab.

    How can i achieve this scenario?

    Thanks
    Shaik Nazeer Hussain

  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 06 Feb 2012 Link to this post

    Hi Shaik,

    You can use some client-side programming to find the RadTabStrip controls and set the desired tab and multipage as selected (you can use the set_selected(true) method) by attaching an event handler on the OnClientClicked event.

    Kind regards,
    Kate
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. nazeer
    nazeer avatar
    27 posts
    Member since:
    May 2009

    Posted 08 Feb 2012 Link to this post

    Hi Kate,

    Can you please give some sample code where can i redirect child tab page to parent tab page.
    I have tried client-side programming, but it did not work.
    I can not able to invoke paret page RadMultipageID  from Child page.

    Please find the screenshot for scenario where i needed.

    Thanks
    Shaik Nazeer Hussain
  5. nazeer
    nazeer avatar
    27 posts
    Member since:
    May 2009

    Posted 09 Feb 2012 Link to this post

    Hi Telerik team,

    Any updates on my above mentioned query.

    Thanks
    Shaik Nazeer Hussain
  6. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 13 Feb 2012 Link to this post

    Hi Shaik,

    You can use the following code to achieve the desired functionality:
    <script type="text/javascript">
                function OnClientClicking(sender, e) {
                    e.set_cancel(true);
                    var tbs = $find("RadTabStrip1");
                    var tab = tbs.get_tabs().getTab(3);
                    tab.set_selected(true);
                }
             
            </script>

    markup:
    <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1"
                SelectedIndex="0">
                <Tabs>
                    <telerik:RadTab Text="Court Info" PageViewID="RadPageView0">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Contacts">
                        <Tabs>
                            <telerik:RadTab Text="tab1">
                            </telerik:RadTab>
                            <telerik:RadTab Text="tab2">
                            </telerik:RadTab>
                        </Tabs>
                    </telerik:RadTab>
                    <telerik:RadTab Text="Activity" PageViewID="RadPageView2">
                    </telerik:RadTab>
                    <telerik:RadTab Text="DueDates" PageViewID="RadPageView3">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Discovery" PageViewID="RadPageView4">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Schedule" PageViewID="RadPageView5">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Settlement" PageViewID="RadPageView6">
                    </telerik:RadTab>
                </Tabs>
            </telerik:RadTabStrip>
            <telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0">
                <telerik:RadPageView ID="RadPageView0" runat="server">
                    page0
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView1" runat="server">
                    page1
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView2" runat="server">
                    page2
                    <telerik:RadButton runat="server" ID="button1" Text="button1" OnClientClicking="OnClientClicking">
                    </telerik:RadButton>
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView3" runat="server">
                    page3
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView4" runat="server">
                    page4
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView5" runat="server">
                    page5
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView6" runat="server">
                    page6
                </telerik:RadPageView>
            </telerik:RadMultiPage>

    Kind regards,
    Kate
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  7. nazeer
    nazeer avatar
    27 posts
    Member since:
    May 2009

    Posted 17 Feb 2012 Link to this post

    Hi Kate,

    Its not working for my scenario.As per my scenario i have changed the code(added contenturl for RadPageview).

    Now i click Activity Tab my page get redirects to page2.aspx.Now if i click button1, i want to redirect my page to page3.aspx and should select DueDates tab.

    <
    telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1"
                SelectedIndex="0">
                <Tabs>
                    <telerik:RadTab Text="Court Info" PageViewID="RadPageView0">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Contacts">
                        <Tabs>
                            <telerik:RadTab Text="tab1">
                            </telerik:RadTab>
                            <telerik:RadTab Text="tab2">
                            </telerik:RadTab>
                        </Tabs>
                    </telerik:RadTab>
                    <telerik:RadTab Text="Activity" PageViewID="RadPageView2">
                    </telerik:RadTab>
                    <telerik:RadTab Text="DueDates" PageViewID="RadPageView3">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Discovery" PageViewID="RadPageView4">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Schedule" PageViewID="RadPageView5">
                    </telerik:RadTab>
                    <telerik:RadTab Text="Settlement" PageViewID="RadPageView6">
                    </telerik:RadTab>
                </Tabs>
            </telerik:RadTabStrip>
            <telerik:RadMultiPage ID="RadMultiPage1" runat="server" SelectedIndex="0">
                <telerik:RadPageView ID="RadPageView0" runat="server" ContentUrl="page0.aspx">
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView1" runat="server" ContentUrl="page1.aspx">
                
    </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView2" runat="server" ContentUrl="page2.aspx">
                    <telerik:RadButton runat="server" ID="button1" Text="button1" OnClientClicking="OnClientClicking">
                    </telerik:RadButton>
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView3" runat="server" ContentUrl="page3.aspx">
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView4" runat="server" ContentUrl="page4.aspx">
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView5" runat="server" ContentUrl="page5.aspx">
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView6" runat="server" ContentUrl="page6.aspx">
                </telerik:RadPageView>
            </telerik:RadMultiPage>



    If i use OnClientClicking function in my Page2.aspx, i can not find the object for RadTabStrip1.
    Please let me know is there any way to acheive this functionality?

    Thanks
    Shaik Nazeer Hussain
  8. Answer
    Kate
    Admin
    Kate avatar
    1898 posts

    Posted 22 Feb 2012 Link to this post

    Hi Shaik,

    You will need to access the parent element of the page whose contentUrl you set (however, this is applicable only in the scenario when the page containing the RadTabStrip control and the page whose content is loaded in the pageview belong to the same domain). Here is an example how you can achieve that (you can also refer to the attached runnable project).

    content page:
    <script type="text/javascript">
            function OnClientClicking(sender, args) {
                window.parent.GetTabStripAndSelectItem();
            }
        </script>
        <div>
            iframe page
            <telerik:RadButton runat="server" ID="button1" Text="button1" AutoPostBack="false"
                OnClientClicking="OnClientClicking">
            </telerik:RadButton>
        </div>

    parent page:
    <script type="text/javascript">
            function GetTabStripAndSelectItem() {
                var tabstrip = $find("RadTabStrip1");
                var tab = tabstrip.get_tabs().getTab(0);
                tab.set_selected(true);
            }
        </script>
        <div>
            <telerik:RadTabStrip ID="RadTabStrip1" SelectedIndex="0" runat="server" MultiPageID="RadMultiPage1">
                <Tabs>
                    <telerik:RadTab Text="tab1" PageViewID="pv1">
                    </telerik:RadTab>
                    <telerik:RadTab Text="tab2" PageViewID="pv2">
                    </telerik:RadTab>
                </Tabs>
            </telerik:RadTabStrip>
            <telerik:RadMultiPage ID="RadMultiPage1" runat="server">
                <telerik:RadPageView ID="pv1" runat="server">
                </telerik:RadPageView>
                <telerik:RadPageView ID="pv2" runat="server" ContentUrl="Default2.aspx">
                </telerik:RadPageView>
            </telerik:RadMultiPage>
        </div>
     
    All the best,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  9. nazeer
    nazeer avatar
    27 posts
    Member since:
    May 2009

    Posted 24 Feb 2012 Link to this post

    Thanks for your support Kate.Its working fine.

    Thanks
    Shaik Nazeer Hussain
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017