I have a problem with raising the event OnClientLoad inside the RadSplitter. I have instantiated 3 Radsplitter inside a RadMultiPage.
If I click the tabs, nothing happens, only if a click the last tab the event OnClientLoad is raised and the alarm dialogbox is shown.
Here my default.aspx:
I have created 3 Tabs dynamically:
My custom control with the splitter Orango.ascx look like:
The same problem occurs if I create 3 instances of Orango.ascx inside the RadPanel. What is wrong?
If I click the tabs, nothing happens, only if a click the last tab the event OnClientLoad is raised and the alarm dialogbox is shown.
Here my default.aspx:
<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/MasterPage.master" CodeFile="Default.aspx.cs" Inherits="_Default" %><asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> <telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal" PanesBorderSize="0" BorderSize="0"> <telerik:RadPane ID="PanelTGDet" runat="server" Locked="true" Height="24" Scrolling="None"> <telerik:RadTabStrip ID="tabStripTalkGroupDetails" OnTabClick="tabStripTalkGroupDetails_OnTabClick" runat="server" MultiPageID="mpageTalkGroupDetails"> <Tabs> </Tabs> </telerik:RadTabStrip> </telerik:RadPane> <telerik:RadPane ID="RadPane3" runat="server" Scrolling="Y" Height="100%"> <telerik:RadMultiPage ID="mpageTalkGroupDetails" OnPageViewCreated="mpageTalkGroupDetails_PageViewCreated" SelectedIndex="0" runat="server"> </telerik:RadMultiPage> </telerik:RadPane> </telerik:RadSplitter></asp:Content>I have created 3 Tabs dynamically:
public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { AddTab("Orango"); AddTab("OrangoTango"); AddTab("AnotherOrango"); } } private void AddTab(string tabName) { RadTab tab = new RadTab(); tab.Text = tabName; tabStripTalkGroupDetails.Tabs.Add(tab); RadPageView pageView = new RadPageView(); pageView.ID = tabName; mpageTalkGroupDetails.PageViews.Add(pageView); } protected void tabStripTalkGroupDetails_OnTabClick(object sender, RadTabStripEventArgs e) { } protected void mpageTalkGroupDetails_PageViewCreated(object sender, RadMultiPageEventArgs e) { string userControlName = string.Empty; switch (e.PageView.ID) { case "Orango": userControlName = "~/Orango.ascx"; break; case "OrangoTango": userControlName = "~/Orango.ascx"; break; case "AnotherOrango": userControlName = "~/Orango.ascx"; break; default: break; } if (!string.IsNullOrEmpty(userControlName)) { Control userControl = Page.LoadControl(userControlName); userControl.ID = e.PageView.ID + "_userControl"; e.PageView.Controls.Add(userControl); } }}My custom control with the splitter Orango.ascx look like:
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Orango.ascx.cs" Inherits="Orango" %><telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"> <script type="text/javascript"> function MySplitloadedORANGO(sender, args) { alert("SplitterLoad ORANGO"); } </script></telerik:RadCodeBlock><telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal" PanesBorderSize="0" OnClientLoad="MySplitloadedORANGO" BorderSize="0" Height="100%"></telerik:RadSplitter>The same problem occurs if I create 3 instances of Orango.ascx inside the RadPanel. What is wrong?
8 Answers, 1 is accepted
0
Hi Igor,
This is expected behavior due to the fact that the multipage is inside another splitter. To avoid this you need to set ResizeWithParentPane property of the UserControl's splitter to false.
In such scenarios the RadSplitter that is inside the UserControl is registered as a nested splitter to the parent pane, but it is not possible to register multiple nested splitters to the pane. That is why the ClientLoad event is fired only for the last splitter.
I hope this helps.
Kind regards,
Dobromir
the Telerik team
This is expected behavior due to the fact that the multipage is inside another splitter. To avoid this you need to set ResizeWithParentPane property of the UserControl's splitter to false.
In such scenarios the RadSplitter that is inside the UserControl is registered as a nested splitter to the parent pane, but it is not possible to register multiple nested splitters to the pane. That is why the ClientLoad event is fired only for the last splitter.
I hope this helps.
Kind regards,
Dobromir
the Telerik team
Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Igor
Top achievements
Rank 1
Rank 1
answered on 06 Dec 2010, 04:19 PM
Thank you for your answer, now I understand.
I have another question about this scenario. On each tab I want to place a RadGrid (Inside RadSplitter1 of Orango.ascx). If I use ResizeWithParentPane=false how can I resize the RadGrid to fill out the RadSplitter?
I have another question about this scenario. On each tab I want to place a RadGrid (Inside RadSplitter1 of Orango.ascx). If I use ResizeWithParentPane=false how can I resize the RadGrid to fill out the RadSplitter?
0
Hi Igor,
By setting the RadSplitter's ResizeWithParentPane="false" the nested splitter no longer automatically occupies the entire RadPane in which it resides. This does not affect the resizing of the nested splitter when you resize the browser window.
To achieve this functionality you need to set Width and Height properties to nested splitter as well. In this scenario the splitter inside the user control should be declared as follows:
Regards,
Dobromir
the Telerik team
By setting the RadSplitter's ResizeWithParentPane="false" the nested splitter no longer automatically occupies the entire RadPane in which it resides. This does not affect the resizing of the nested splitter when you resize the browser window.
To achieve this functionality you need to set Width and Height properties to nested splitter as well. In this scenario the splitter inside the user control should be declared as follows:
<telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal" PanesBorderSize="0" OnClientLoad="MySplitloadedORANGO" BorderSize="0" Width="100%" Height="100%"></telerik:RadSplitter>Regards,
Dobromir
the Telerik team
Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Igor
Top achievements
Rank 1
Rank 1
answered on 14 Dec 2010, 04:08 PM
Hi Dobromir,
your suggestion works. When I click on tab the grid fill out the parent splitter and it looks great, but my application is a little more complex.
I have also an horizontal splitbar up to the Multipage to resize RadPanel3. When I move it, the Multipage becomes bigger, but the splitter in custom control doesn't resize (ResizeWithParentPane=false). The same effect occurs when I resize the browser window . I think to change manually the size of RadSplitter1 inside the custom control using javascript. How it is possible?
your suggestion works. When I click on tab the grid fill out the parent splitter and it looks great, but my application is a little more complex.
I have also an horizontal splitbar up to the Multipage to resize RadPanel3. When I move it, the Multipage becomes bigger, but the splitter in custom control doesn't resize (ResizeWithParentPane=false). The same effect occurs when I resize the browser window . I think to change manually the size of RadSplitter1 inside the custom control using javascript. How it is possible?
0
Hi Igor,
When nested RadSplitter have width and height properties set in percentage values it falls under the same requirements when you want a splitter to occupy the entire page - you need to make sure that all of its parents have set height. In this specific scenario you need to set height to the RadMultiPage and the created PageView controls, e.g.:
For your convenience I have attached a sample page.
All the best,
Dobromir
the Telerik team
When nested RadSplitter have width and height properties set in percentage values it falls under the same requirements when you want a splitter to occupy the entire page - you need to make sure that all of its parents have set height. In this specific scenario you need to set height to the RadMultiPage and the created PageView controls, e.g.:
<telerik:RadMultiPage ID="mpageTalkGroupDetails" OnPageViewCreated="mpageTalkGroupDetails_PageViewCreated" SelectedIndex="0" runat="server" Height="100%">RadPageView pageView = new RadPageView();pageView.ID = tabName;pageView.Height = Unit.Percentage(100);mpageTalkGroupDetails.PageViews.Add(pageView);For your convenience I have attached a sample page.
All the best,
Dobromir
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Igor
Top achievements
Rank 1
Rank 1
answered on 15 Dec 2010, 10:39 AM
Hi Dobromir,
Thank you very much for the example. I have modified it and added a radgrid.
The result is that only on the first tab you can see the radgrid and the vertical resize with the splitbar doesn't affect the size of the grid. On the second and third tab the grid is not visible. Do I have missed something?
The full modified project is on default02.zip
Thank you very much for the example. I have modified it and added a radgrid.
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Orango.ascx.cs" Inherits="Orango" %><telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"></telerik:RadCodeBlock><telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal" PanesBorderSize="0" Width="100%" Height="100%" ResizeWithParentPane="false"> <telerik:RadPane ID="RadPane2" Height="64px" runat="server"> <asp:Label runat="server" Text="Below an Orango grid " /> </telerik:RadPane> <telerik:RadPane ID="RadPane1" Width="100%" Height="100%" runat="server"> <telerik:RadGrid ID="gridOrangos" runat="server" OnNeedDataSource="gridOrangos_NeedDataSource" ShowFooter="true"> <MasterTableView DataKeyNames="OrangoName" ClientDataKeyNames="OrangoName"> </MasterTableView> <ClientSettings EnableRowHoverStyle="true"> <Selecting AllowRowSelect="true" /> <Scrolling AllowScroll="true" UseStaticHeaders="true" /> </ClientSettings> </telerik:RadGrid> </telerik:RadPane></telerik:RadSplitter>protected void gridOrangos_NeedDataSource(object source, GridNeedDataSourceEventArgs e) { DataTable dt = new DataTable(); dt.Columns.Add("OrangoName", Type.GetType("System.String")); dt.Rows.Add(new object[] { "bingo" }); dt.Rows.Add(new object[] { "bongo" }); dt.Rows.Add(new object[] { "Cita" }); gridOrangos.DataSource = dt; }The result is that only on the first tab you can see the radgrid and the vertical resize with the splitbar doesn't affect the size of the grid. On the second and third tab the grid is not visible. Do I have missed something?
The full modified project is on default02.zip
0
Hi Igor,
The problem occurs because the height value of the dynamically created PageView is not persisted through postbacks that are caused by clicking on the tab. To avoid this you need to call AddTab() method every time, not only on initial load. You can simply remove the check for a postback in the Page_Init, e.g.:
Also, by design RadSplitter persists the size of its panes over postbacks, so you will need to clear the values of the "free sized" pane (that is a RadPane without set width and height properties) during page load, e.g.:
For your convenience I have attached modified sample page.
Regards,
Dobromir
the Telerik team
The problem occurs because the height value of the dynamically created PageView is not persisted through postbacks that are caused by clicking on the tab. To avoid this you need to call AddTab() method every time, not only on initial load. You can simply remove the check for a postback in the Page_Init, e.g.:
protected void Page_Init(object sender, EventArgs e){ AddTab("Orango"); AddTab("OrangoTango"); AddTab("AnotherOrango"); tabStripTalkGroupDetails.SelectedIndex = 0; mpageTalkGroupDetails.SelectedIndex = 0;
}Also, by design RadSplitter persists the size of its panes over postbacks, so you will need to clear the values of the "free sized" pane (that is a RadPane without set width and height properties) during page load, e.g.:
protected void Page_Load(object sender, EventArgs e){ //ScriptManager.RegisterStartupScript(Page, Page.GetType(), ""+new Random(), "function MySplitloadedORANGO(sender, args){alert(1);}", true); //RadSplitter1.OnClientLoad = "MySplitloadedORANGO"; RadPane1.Width = Unit.Empty; RadPane1.Height = Unit.Empty;}For your convenience I have attached modified sample page.
Regards,
Dobromir
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Igor
Top achievements
Rank 1
Rank 1
answered on 21 Dec 2010, 06:13 PM
Hi Dobromir,
thank you very much for your support, it help me to solve my problem.
I have missed some things: ResizeWithParent=false on each child splitter, PageView Height=100% and the reset of the Panel that contains the grid when Page.Load TabClick postback handler should be also declared.
Best regards,
Igor
thank you very much for your support, it help me to solve my problem.
I have missed some things: ResizeWithParent=false on each child splitter, PageView Height=100% and the reset of the Panel that contains the grid when Page.Load TabClick postback handler should be also declared.
Best regards,
Igor