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

resize of radslidingpane

3 Answers 190 Views
Splitter
This is a migrated thread and some comments may be shown as answers.
appdev
Top achievements
Rank 1
appdev asked on 23 Aug 2009, 09:39 PM
below is just part of the code but i have a radsplitter and if i change the height="23px" at telerik:radsplitter i won't see the window after i piinned it. if i take it out, it works fine. also the liveresize doesn't work. it doesn't automatically resize my window and so is full screen mode, and if i drag the bottom of it to expand my pane, it works ok not great. can you help me figure this out? this is what i want it to do.

Graph sliding pane title

data table

there should be only 2 lines break between graph sliding pane titleand datatable. if you mouse over graph, it expands and open the pane to show the graph and push down the datatable. but the height is not big enough. I can resize with right now but i want to default it to the size the graph will dynamically have.  if i change the height="23px" at telerik:radsplitter i won't see the window after i piinned it. if i take it out, it works fine.
please help. thanks








 <asp:Table ID="tbl_Report" runat="server" BorderColor="black" cellpadding="5" cellspacing="0" width="100%" HorizontalAlign="center" height="100%" BackColor="#ffffff">  
            <asp:TableRow> 
                <asp:TableCell ColumnSpan="2"><asp:Label ID="lb_Error" runat="server" Font-Bold="true" ForeColor="red" /></asp:TableCell> 
            </asp:TableRow>                                                        
            <asp:TableRow> 
                <asp:TableCell VerticalAlign="top" ColumnSpan="2" Width="100%" Height="100%" BackColor="white">  
                    <telerik:RadSplitter id="RadSplitter1" runat="server" CssClass="CustomCssClass1" Skin="Forest" Width="100%" height="23px" 
                       ResizeMode="EndPane" LiveResize="true" visible="false" FullScreenMode="true">  
                        <telerik:RadPane runat="server" id="RadPane1" Width="100%" Height="100%" > 
                            <telerik:RadSlidingZone runat="server" ID="RadSlidingZone_Graph" SlideDirection="Bottom">  
                                 <telerik:RadSlidingPane id="RadSlidingPane_Graph" title="Graph" runat="server" EnableResize="true">  
                                    <telerik:RadComboBox ID="ddlcharttype" Font-Size="12px" runat="server" Skin="Forest" AutoPostBack="true">                                                                                                  
                                        <Items> 
                                            <telerik:RadComboBoxItem Text="Select a chart type" Value="" /> 
                                            <telerik:RadComboBoxItem Text="Area" Value="Area" /> 
                                            <telerik:RadComboBoxItem Text="Bar" Value="Bar" /> 
                                            <telerik:RadComboBoxItem Text="Column" Value="Column" /> 
                                            <telerik:RadComboBoxItem Text="Line" Value="Line" /> 
                                        </Items> 
                                    </telerik:RadComboBox> <br />   
                                    <div id="printer"><asp:Literal ID="literal_adhoc_Graph" runat="server" /></div>  
                                 </telerik:RadSlidingPane> 
                            </telerik:RadSlidingZone>                                                
                        </telerik:RadPane> 
                    </telerik:RadSplitter>     

3 Answers, 1 is accepted

Sort by
0
Svetlina Anati
Telerik team
answered on 24 Aug 2009, 08:07 AM
Hi Duy,

I already answered your support thread and for your convenience and for others who might have similar questions I pasted my reply below:


First of all, let me explain how the dock functionality of the RadSlidingPane works. The RadSlidingPane is a child of a RadSlidingZone, which in turn is a child of a RadPane. When the RadSlidingPane slides out, it should show over any content of an adjacent RadPane. Because of this, it does not act as a child of its parent RadPane. However, when you try to dock a RadSlidingPane, you force it into its parent RadPane. At this point, in order for the RadSlidingPane to show all its content (without its parent RadPane to show scrollbars because of its Height=22px), the RadSlidingPane tries to resize its parent RadPane and in case it fails, it collapses. However, in order to be able to resize a RadPane, you have to define at least two RadPanes in the RadSplitter. That way, when you resize the top pane to a larger height, the bottom pane will resize to a smaller height, leading to the RadSplitter keeping its correct Height.

Having said that, in order to use the dock functionality of the RadSplidingPane, you have to define at least two RadPanes in your RadSplitter. What I suggest is to remove the whole table and use splitters instead.

Note, also that the FullScreenMode property is obsolete and in order to get the same result you should use the approach explained here:

http://demos.telerik.com/aspnet-ajax/splitter/examples/resizewithwindow/defaultcs.aspx

Also, you can have SlideDirection Top/Bottom only if your splitter is with horizontal orientation - in your case it is vertical which is the default setting and thus you can have only Right/Left direction. However, you can nest a horizontal splitter in a vertical one to get the desired result.

As to your other questions:

- I am not completley sure what is  the problem with pushing content down but I believe that it will be solved when you replace teh tables with splitters

- I could not understand how exactly you expect the LiveResize property to work -  it gives you a real time preview of the content during the resizing of the panes as you can see in the demo below:

http://demos.telerik.com/aspnet-ajax/splitter/examples/liveresize/defaultcs.aspx

This means that the panes are resized  while the splitbar is being dragged - if the property is false, they will resize after you release the splitbar.

I recommend to examine our online demos below and I believe that you will find some useful configuration tips there:

http://demos.telerik.com/aspnet-ajax/splitter/examples/overview/defaultcs.aspx

I hope that my explanations and suggestions are detailed and helpful enough, let me know how it goes.



All the best,
Svetlina
the Telerik team


Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Jason
Top achievements
Rank 2
answered on 25 Dec 2009, 01:36 AM
Great post Svetlina.  That made me understand how they work much better and made it possible for me to start back using panes.

Adisa
0
Svetlina Anati
Telerik team
answered on 25 Dec 2009, 11:03 AM
Hi Adisa,

I am glad that my explanation was detailed enough and helpful! In case you experience any problems or you have additional questions, do not hesitate to raise them, we will be happy to help.

Best wishes,
Svetlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Tags
Splitter
Asked by
appdev
Top achievements
Rank 1
Answers by
Svetlina Anati
Telerik team
Jason
Top achievements
Rank 2
Share this question
or