My requirement is to build two panes. Left should be collapsed and have two sliding panes for preview buttons. Right pane should load usercontrol and should be expanded to 100%. The problem is that sliding pane doesnt have method set_contenturl(). so i cannot load external urls for each sliding pane. If i load the url in parent pane than the sliding pane gets overwritten and invisible. Somehow i cannot get right pane to expand upto 100%.
<
telerik:RadSplitter ID="RadSplitter1" Runat="server" Height="100%"
PanesBorderSize="3" Skin="Sunset" SplitBarsSize="8px" Width="100%">
<telerik:RadPane ID="RadPane1" Runat="server">
<telerik:RadSlidingZone ID="RadSlidingZone1" Runat="server">
<telerik:RadSlidingPane ID="RadSlidingPane1" Runat="server" Title="Load Yahoo" TabView="TextAndImage" OnClientExpanding="OnYahooExpanding" EnableDock="true"
CollapseText="Yahoo">
</telerik:RadSlidingPane>
<telerik:RadSlidingPane ID="RadSlidingPane2" Runat="server" Title="Load Google" TabView="TextAndImage" OnClientExpanding="OnGoogleExpanding" EnableDock="true"
CollapseText="Google">
</telerik:RadSlidingPane>
</telerik:RadSlidingZone>
</telerik:RadPane>
<telerik:RadSplitBar ID="RadSplitBar1" runat="server">
</telerik:RadSplitBar>
<telerik:RadPane ID="RadPane2" runat="server">
<uc1:WebUserControl ID="WebUserControl1" runat="server" />
</telerik:RadPane>
</telerik:RadSplitter>
Here is javascript code
<
telerik:RadScriptBlock ID="scriptBlock" runat="server">
<script type="text/javascript">
function OnYahooExpanding(sender, args) {
viewYahoo();
}
function OnGoogleExpanding(sender, args) {
viewGoogle();
}
function viewYahoo() {
var splitter = $find("<%=RadSplitter1.ClientID %>");
var pane = splitter.getPaneById("<%=RadPane1.ClientID %>");
if (!pane) return;
pane.set_contentUrl(
'http://www.yahoo.com');
pane.expand();
}
function viewGoogle() {
var splitter = $find("<%=RadSplitter1.ClientID %>");
var pane = splitter.getPaneById("<%=RadPane1.ClientID %>");
if (!pane) return;
pane.set_contentUrl(
'http://www.google.com');
pane.expand();
}
</script>