This is a migrated thread and some comments may be shown as answers.

RadPageView is not loaded when a tab is selected from the client

3 Answers 129 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
klac
Top achievements
Rank 1
klac asked on 17 May 2017, 10:41 PM

I'm selecting the initial tab in javascript and while the tab gets selected and the RadPageView gets selected, a postback does not occur to load the page.Clicking on the other tab will load that page and clicking back to the original tab will then load that page as well. Is there another way to select the tab and cause a postback? 

 

Thanks

<%@ Page Language="C#" Inherits="TestPage" CodeBehind="TestPage.aspx.cs" %>
 
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
 
 
<head runat="server">
    <title>Title</title>
</head>
<body>
    <form id="form1" runat="server" style="height: 100%">
        <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
 
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="rtsCCC">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rtsCCC"></telerik:AjaxUpdatedControl>
                        <telerik:AjaxUpdatedControl ControlID="rmpCCC"></telerik:AjaxUpdatedControl>
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
 
        <telerik:RadTabStrip runat="server" ID="rtsCCC" RenderMode="Lightweight" MultiPageID="rmpCCC" Style="line-height: 0" AutoPostBack="True" OnClientLoad="OnTabStripLoaded">
            <Tabs>
                <telerik:RadTab runat="server" Text="Tab1" Value="t1" />
                <telerik:RadTab runat="server" Text="Tab2" Value="t2" />
            </Tabs>
        </telerik:RadTabStrip>
 
        <telerik:RadMultiPage runat="server" ID="rmpCCC" RenderSelectedPageOnly="True" Height="100%" >
            <telerik:RadPageView runat="server" ID="rpvTab1" Height="100%" Style="overflow: hidden">
                Tab1 content
            </telerik:RadPageView>
 
            <telerik:RadPageView runat="server" ID="rpvTab2" Height="100%" Style="overflow: hidden">
                Tab2 content
            </telerik:RadPageView>
        </telerik:RadMultiPage>
    </form>
 
    <script type="text/javascript">
        var tabStrip = null;
        function OnTabStripLoaded(sender)
        {
            tabStrip = sender;
            setTimeout(function () {
                var tab = tabStrip.findTabByValue("t2");
                tab.select();
            }, 1000);
        }
 
    </script>
</body>
</html>

3 Answers, 1 is accepted

Sort by
0
klac
Top achievements
Rank 1
answered on 17 May 2017, 10:45 PM
Admin: Please remove the namespace in the Inherits="" from the first post. Thanks.
0
Marin Bratanov
Telerik team
answered on 22 May 2017, 12:02 PM

Hi,

You can simply set the Selected property of the desired tab and page view to true. The SelectedIndex of the MultiPage is also an option.

If you want to do this with JS, use the .click() method of the tab to simulate the actual click operation, otherwise only the appearance is changed via the select() or set_selected() method, which works best for pure client-side implementations.

Regards,

Marin Bratanov
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
klac
Top achievements
Rank 1
answered on 22 May 2017, 03:00 PM
Thank you
Tags
TabStrip
Asked by
klac
Top achievements
Rank 1
Answers by
klac
Top achievements
Rank 1
Marin Bratanov
Telerik team
Share this question
or