How to set the target of a TreeView (populated from a sqldatasource) to a RadPane on the same page in UI for ASP.NET AJAX TreeView

Matt Johnston

6 posts

Member since:
Dec 2008

Posted 07 Mar 2009 Link to this post

I've searched through the forums and can't find a solid solution to this.

Here is the scenario:

I'm populating a RadTreeView with data from a sqldatasource.
Here are the lines of code that set the data source and related fields.

    
                                         DataFieldParentID="parentid" 
        
                                         DataFieldID="id"                              
        
                                         DataTextField="tooltip" 
        
                                         DataNavigateUrlField="url"  
        
                                         DataSourceID="SqlDataSource1"

When i click on a node i want the NavigateUrl that has been set from the sqldatasource to open in a RadPane (that's located on the same page)

Veselin Vasilev

Admin

2992 posts

Posted 09 Mar 2009 Link to this post

Hello Matt Johnston,

There are two options:

Use DataBindings:

    
            <telerik:RadSplitter ID="RadSplitter1" runat="server"> 
        
            <telerik:RadPane ID="RadPane1" runat="server"> 
        
                <telerik:RadTreeView ID="RadTreeView1"  
        
                    runat="server"  
        
                    DataFieldID="EmployeeID"  
        
                    DataFieldParentID="ReportsTo"  
        
                    DataTextField="FirstName" 
        
                    DataNavigateUrlField="URL" 
        
                    DataSourceID="SqlDataSource1"  
        
                    Skin="Vista"> 
        
                <DataBindings> 
        
                    <telerik:RadTreeNodeBinding Target="RadPane2" /> 
        
                </DataBindings>                 
        
                </telerik:RadTreeView> 
        
            </telerik:RadPane> 
        
            <telerik:RadSplitBar ID="RadSplit1" runat="server" /> 
        
            <telerik:RadPane ID="RadPane2" runat="server" ContentUrl="about:blank"></telerik:RadPane> 
        
            </telerik:RadSplitter>

Use NodeDataBound event and set the Target property of the nodes:

    
            protected void RadTreeView1_NodeDataBound(object  sender, RadTreeNodeEventArgs e) 
        
            { 
        
               e.Node.Target = "RadPane2"; 
        
            }

I hope this helps.
Regards,
Veselin Vasilev
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.

Matt Johnston

6 posts

Member since:
Dec 2008

Posted 09 Mar 2009 Link to this post

I tried both methods and instead of opening the url in the same window it now opens in a new window. So it still doesn't open in thes desired pane. Any ideas?

Here is my code

    
                <telerik:RadSplitter  
        
                    ID="MainSplitter"  
        
                    runat="server"  
        
                    LiveResize="True"  
        
                    Height="92%" 
        
                    Width="100%" 
        
                    Orientation="Vertical" 
        
                    SplitBarsSize="7px" 
        
                    Skin="Outlook"> 
        
                    <telerik:RadPane  
        
                        ID="LeftPane"  
        
                        Runat="server"  
        
                        width="250"  
        
                        scrolling="None" 
        
                        minwidth="22"> 
        
                        <telerik:RadPanelBar  
        
                            ID="RadPanelBar1"  
        
                            runat="server"  
        
                            Skin="Outlook"  
        
                            Height="100%">   
        
                            <CollapseAnimation Duration="100" Type="None" /> 
        
                            <Items> 
        
                                <telerik:RadPanelItem runat="server" Text="My Projects" Expanded="True"> 
        
                                     <Items> 
        
                                       <telerik:RadPanelItem 
        
                                         runat="server" 
        
                                         Text="Please Enter your details:" /> 
        
                                     </Items> 
        
                                     <ItemTemplate> 
        
                                        <telerik:RadTreeView 
        
                                            ID="RadTreeView1" 
        
                                            runat="server" 
        
                                            Skin="WebBlue" 
        
                                            DataFieldParentID="parentid" 
        
                                            DataFieldID="id"                              
        
                                            DataTextField="text" 
        
                                            DataNavigateUrlField="url"  
        
                                            DataSourceID="SqlDataSource1"> 
        
                                                <DataBindings>  
        
                                                    <telerik:RadTreeNodeBinding Target="ContentPane" />  
        
                                                </DataBindings>              
        
                                        </telerik:RadTreeView> 
        
                                        <asp:SqlDataSource ID="SqlDataSource1" runat="server"  
        
                                            ConnectionString="<%$ ConnectionStrings:dbconnection %>"  
        
                                            SelectCommand="SELECT parentid, id, text, url FROM tbltv ORDER BY id"> 
        
                                        </asp:SqlDataSource>   
        
                                     </ItemTemplate> 
        
                                </telerik:RadPanelItem> 
        
                                <telerik:RadPanelItem runat="server" Text="All Projects"> 
        
                                    <Items> 
        
                                        <telerik:RadPanelItem runat="server" Text="Project1"> 
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem runat="server" Text="Project2"> 
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem runat="server" IsSeparator="True" Text="&lt;hr&gt;"> 
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem runat="server" Text="Project4"> 
        
                                        </telerik:RadPanelItem> 
        
                                    </Items> 
        
                                </telerik:RadPanelItem>                     
        
                                <telerik:RadPanelItem runat="server" Text="Calendar"> 
        
                                    <Items> 
        
                                        <telerik:RadPanelItem runat="server"> 
        
                                        </telerik:RadPanelItem> 
        
                                    </Items> 
        
                                </telerik:RadPanelItem> 
        
                                <telerik:RadPanelItem runat="server" Text="Notes"> 
        
                                </telerik:RadPanelItem> 
        
                            </Items> 
        
                            <ExpandAnimation Duration="100" Type="None" /> 
        
                        </telerik:RadPanelBar> 
        
                    </telerik:RadPane>     
        
                    <telerik:RadSplitBar runat="server" id="RadSplitBar1"  CollapseMode="Both" />             
        
                     <telerik:RadPane runat="server" id="MiddlePane"> 
        
                        <telerik:RadSplitter  
        
                            runat="server"  
        
                            id="InnerSplitter"  
        
                            Orientation="Horizontal" 
        
                            SplitBarsSize="7px" 
        
                            Skin="Outlook"> 
        
                                <telerik:RadPane  
        
                                    runat="server"  
        
                                    id="ContentPane" 
        
                                    ContentUrl="about:blank"     
        
                                    scrolling="X" /> 
        
                                <telerik:RadSplitBar runat="server" id="RadSplitBar2"  CollapseMode="Both"/> 
        
                                <telerik:RadPane  
        
                                    runat="server"  
        
                                    id="DetailPane" 
        
                                    ContentUrl="about:blank"   
        
                                    scrolling="X" /> 
        
                        </telerik:RadSplitter> 
        
                    </telerik:RadPane> 
        
                </telerik:RadSplitter>

Gabe Silvarajoo

13 posts

Member since:
Apr 2009

Posted 20 Jul 2009 Link to this post

I have the same problem but I am using a web user control. Is there a workaround if you're using user control?

Gabe Silvarajoo

13 posts

Member since:
Apr 2009

Posted 22 Jul 2009 Link to this post

Found the solution. If using user control, do a view source of the page and see what the pane name is after it's being rendered. I named the pane "bbbbb" but when its being rendered, its name changed to xxxx_bbbbb.

Matt Johnston

6 posts

Member since:
Dec 2008

Posted 25 Aug 2009 Link to this post

That was the answer, I was using a master page