or
Hi, I am trying to make my splitter fit into the div that i specify.
Following code works perfect when placed inside aspx, but the UI changes (radSplitter now takes default width and height of 400px) when the same code is places inside the ascx.
I am not sure, why ? Ideally, the RadSplitter should use the absolute dimensions of the container to set its width and height.
Why should i bother to set the dimensions for all parent containers ?? The moment i specify absolute values for the container, the child controls should use those values.
Please correct me if my understanding is wrong.
<div style="width: 700px; height: 500px; border: 2px solid orange;"><asp:ScriptManager ID="ScriptManager1" runat="server" /> <telerik:RadSplitter ID="SplitterHorizontal" runat="server" height="100%" width="100%" Scrolling="None"> <telerik:RadPane ID="LeftPane" runat="server" width="30%"> <telerik:RadSplitter ID="VerticalSplitter" Orientation="Horizontal" runat="server"> <telerik:RadPane ID="LeftTopPane" runat="server" style="height:50%"> </telerik:RadPane> <telerik:RadSplitBar ID="HorizontalSplitBar" runat="server" CollapseMode="Forward" /> <telerik:RadPane ID="LeftBottomPane" runat="server" height="50%" > </telerik:RadPane> </telerik:RadSplitter> </telerik:RadPane> <telerik:RadSplitBar ID="VerticalSplitBar" runat="server" CollapseMode="Forward" /> <telerik:RadPane ID="RightPane" runat="server" width="70%"> </telerik:RadPane> </telerik:RadSplitter></div><script type="text/javascript">//global variables for the countries and cities comboboxesvar countriesCombo;var citiesCombo;function pageLoad(){ // initialize the global variables // in this event all client objects // are already created and initialized countriesCombo = $find("<%= RadComboBox2.ClientID %>"); citiesCombo = $find("<%= RadComboBox3.ClientID %>");}function LoadCountries(sender, eventArgs){ var item = eventArgs.get_item(); countriesCombo.set_text("Loading..."); citiesCombo.clearSelection(); // if a continent is selected if (item.get_index() > 0) { // this will fire the ItemsRequested event of the // countries combobox passing the continentID as a parameter countriesCombo.requestItems(item.get_value(), false); } else { // the -Select a continent- item was chosen countriesCombo.set_text(" "); countriesCombo.clearItems(); citiesCombo.set_text(" "); citiesCombo.clearItems(); }}function LoadCities(sender, eventArgs){ var item = eventArgs.get_item(); citiesCombo.set_text("Loading..."); // this will fire the ItemsRequested event of the // cities combobox passing the countryID as a parameter citiesCombo.requestItems(item.get_value(), false); }function ItemsLoaded(sender, eventArgs){ if (sender.get_items().get_count() > 0) { // pre-select the first item sender.set_text(sender.get_items().getItem(0).get_text()); sender.get_items().getItem(0).highlight(); } sender.showDropDown();} </script>

