rad Pane sliding OnClientExpanded Event

4 posts, 2 answers
  1. Arindam
    Arindam avatar
    28 posts
    Member since:
    Mar 2009

    Posted 08 Jul 2009 Link to this post

    Hello Friends,

    I am having a slight problem with RadSplitter, what I am doing is that I am having 3 rad panes. Now on Click of 1st sliding zone of 3rd Rad Pane, I want to disable the 1st sliding zone of 1st Rad Pane. Find the code below :-

    <telerik:RadSplitter ID="RadSplitter1" runat="server" Width="950" Height="500">
               <telerik:RadPane ID="LeftPane" runat="server" Width="22px" Scrolling="none" BackColor="#BDCAF4">
                    <telerik:RadSlidingZone ID="SlidingZone1" runat="server" Width="22px" ClickToOpen="true">
                        <telerik:RadSlidingPane ID="RadSlidingPane1" Title="Dashboard Reports" runat="server"
                        Width="150px" BackColor="#BDCAF4" >
                            <telerik:RadTreeView ID="RadTreeView1" runat="server" OnClientMouseOver= "OnClientMouseOver"
                        EnableDragAndDrop="True" OnClientNodeDropping="OnClientNodeDropping" >
                        </telerik:RadTreeView>
                        </telerik:RadSlidingPane>
    //This is the first rad sliding pane
                    </telerik:RadSlidingZone>
                </telerik:RadPane>
                <telerik:RadSplitBar ID="Radsplitbar1" runat="server"></telerik:RadSplitBar>
                <telerik:RadPane ID="MiddlePane1" runat="server" Scrolling="None" BackColor="lightskyblue">
                    <telerik:RadSplitter ID="Radsplitter2" runat="server" Orientation="Horizontal" VisibleDuringInit="false">
                        <telerik:RadSplitBar ID="Radsplitbar3" runat="server"></telerik:RadSplitBar>
                        <telerik:RadPane ID="Radpane2" runat="server">
                            <div id="SummaryDiv2" style="width:925px;height:480px;"></div>
                            
                            <telerik:RadWindowManager ID="RadWindowManager1" runat="server" VisibleOnPageLoad="false"
                                VisibleTitlebar="true" VisibleStatusbar="false"
                                ReloadOnShow ="true" ShowContentDuringLoad="true" RestrictionZoneID="SummaryDiv2"
                                Overlay="true" Animation="Fade"
                                MinimizeZoneID="MyMinWins" OnClientCommand="oCCWindow">
                            </telerik:RadWindowManager>
                            
                            <telerik:RadToolTipManager Width="300px" Height="300px" RelativeTo="element"
                                ID="RadToolTipManager1" runat = "server" OffsetX="15" Skin="Telerik" Position="MiddleRight"
                                OnAjaxUpdate="RadToolTipmanager1_AjaxUpdate" >
                            </telerik:RadToolTipManager>
                    
                        </telerik:RadPane>
                    </telerik:RadSplitter>
                </telerik:RadPane>
                <telerik:RadSplitBar ID="RadSplitBar2" runat="server"></telerik:RadSplitBar>
                <telerik:RadPane ID="EndPane" runat="server" Width="22px" Scrolling="None">
                    <telerik:RadSlidingZone ID="Radslidingzone1" runat="server" Width="22px" SlideDirection="Left" ClickToOpen="true">
                        <telerik:RadSlidingPane ID="Radslidingpane5" Title="Company Dashboards" runat="server"
                        Width="150px" BackColor="#FFC486" ForeColor="red"  CssClass="LeftPaneCSS" OnClientExpanded="DisableDashboard" > //this javascript will be used to slide the first pane i.e. RadTreeView1
                            <telerik:RadTreeView id="CompTree" runat="server" >
                        </telerik:RadTreeView>
                        </telerik:RadSlidingPane>
                        <telerik:RadSlidingPane ID="Radslidingpane6" Title="Personal Dashboards" runat="server"
                        Width="150px" BackColor="#FFE086" ForeColor="Chocolate" CssClass="EndPaneCSS">
                           <telerik:RadTreeView ID="DBDTree" runat="server" OnNodeClick="DBDTree_NodeClick" AllowNodeEditing="true"
                             OnClientContextMenuItemClicking="onClientContextMenuItemClicking"  OnClientContextMenuShowing="onClientContextMenuShowing"
                              OnClientNodeClicked="ClientNodeClicked" OnNodeEdit="DBDTree_NodeEdit"
                             OnContextMenuItemClick="DBDTree_ContextMenuItemClick" EnableDragAndDrop="true" EnableDragAndDropBetweenNodes="true"
                              OnNodeDrop="DBDTree_HandleDrop">
                            
                            </telerik:RadTreeView>
                        </telerik:RadSlidingPane>
                    </telerik:RadSlidingZone>
                </telerik:RadPane>
            </telerik:RadSplitter>

    What should be the javascript :-
    function DisableDashboard()
    {} //I am unable to figure it out. Basically I need to disable drag and drop feature of RadtreeView1 once clicked on Company dashboard i.e RadTreeview ID = "CompTree"

    Please suggest me a way!

    Thanks
    Arindam R


  2. Answer
    Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 09 Jul 2009 Link to this post

    Hello Arindam,

    As far as I understand from your explanations, by disabling the sliding zone you mean that you want to disable the drag and drop functionality of the RadTreeView. If this is correct, in the DisableDashboard function ayou should obtain a reference to the treeview by using the method $find and then call the set_enableDragAndDrop and set_enableDragAndDropBetweenNodes methods with argument false. Both the method are listed in teh client API reference of the tree view control which is availabkle below:

    http://www.telerik.com/help/aspnet-ajax/tree_clientradtreeviewobject.html

    In case this is not what you want, please provide more detailed information on your exact goal. 

    Kind regards,
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Arindam
    Arindam avatar
    28 posts
    Member since:
    Mar 2009

    Posted 09 Jul 2009 Link to this post

    Thanks Svetlina,

    I figured it out the solution I put the javascript

    function DisableDashboard()
    {
        var tree = $find("<%= RadTreeView1.ClientID %>");
           if(tree.get_enabled())
           {
              tree.set_enabled(false);
           }
           else
           {
              tree.set_enabled(true);
           }    


    }

    and it work fine for me, thanks a lot

    Arindam R







  5. Answer
    Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 09 Jul 2009 Link to this post

    Hi Arindam,

    I am glad I could help! I see from your code that you actually toggle the enabled state - you can minimize and improve your code in the following manner:


    function DisableDashboard()  
    {  
        var tree = $find("<%= RadTreeView1.ClientID %>");  
        tree.set_enabled(!tree.get_enabled());  
    }   
     

    I hope that my suggestion is helpful. In case you have any further questions, do not hesitate to contact us again.

    Kind regards,
    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.
Back to Top