Executing event on Node Expand Image click in Rad Tree View

2 posts, 1 answers
  1. A2H
    A2H avatar
    177 posts
    Member since:
    Mar 2010

    Posted 07 Jul 2012 Link to this post

    Hi,

    I have a page designed with Rad Tree View. I need to acheive the following scenario.
    In the expand node image click of rad tree view,I need to show a Tool Tip based on certain condition( See the Attached Image)

    I have specified Rad Tool Tip control ,but I am not sure which control I will give for "TargetControlID".

    I have used Javascript OnClientNodeExpaned event.
    When I tried to display RadToolTip with out Target Control Id using Show() method.I am getting "Object expected Error".

    How will I acheive the scenario.

  2. Answer
    Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 09 Jul 2012 Link to this post

    Hi A2H,

    I suppose you want to show RadToolTip based on the expanded RadTreeNode. Here is the sample code.

    ASPX:
    <telerik:RadTreeView ID="RadTreeView1" runat="server" OnClientNodeExpanded="OnClientNodeExpanded">
      <Nodes>
         <telerik:RadTreeNode Text="RadTreeNode1">
            <Nodes>
                  <telerik:RadTreeNode Text="RadTreeNode11">
                  </telerik:RadTreeNode>
                  <telerik:RadTreeNode Text="RadTreeNode12">
                  </telerik:RadTreeNode>
                  <telerik:RadTreeNode Text="RadTreeNode13">
                  </telerik:RadTreeNode>
            </Nodes>
         </telerik:RadTreeNode>
         <telerik:RadTreeNode Text="RadTreeNode2">
            <Nodes>
                  <telerik:RadTreeNode Text="RadTreeNode21">
                  </telerik:RadTreeNode>
                  <telerik:RadTreeNode Text="RadTreeNode22">
                  </telerik:RadTreeNode>
                  <telerik:RadTreeNode Text="RadTreeNode23">
                  </telerik:RadTreeNode>
            </Nodes>
         </telerik:RadTreeNode>
         <telerik:RadTreeNode Text="RadTreeNode3">
            <Nodes>
                  <telerik:RadTreeNode Text="RadTreeNode31">
                  </telerik:RadTreeNode>
                  <telerik:RadTreeNode Text="RadTreeNode32">
                  </telerik:RadTreeNode>
                  <telerik:RadTreeNode Text="RadTreeNode33">
               </telerik:RadTreeNode>
            </Nodes>
         </telerik:RadTreeNode>
      </Nodes>
    </telerik:RadTreeView>
    <telerik:RadToolTip ID="RadToolTip1" runat="server" Position="Center">
    </telerik:RadToolTip>

    JS:
    <script type="text/javascript">
        function OnClientNodeExpanded(sender, args) {
            debugger;
            var tooltip = $find("<%= RadToolTip1.ClientID %>");
            if (args.get_node().get_text() == "RadTreeNode1") // Your Condition
            {
                tooltip.set_text("RadTreeNode1");
                tooltip.show();
            }
            else if (args.get_node().get_text() == "RadTreeNode2")// Your Condition
            {
                tooltip.set_text("RadTreeNode2");
                tooltip.show();
            }
            else if (args.get_node().get_text() == "RadTreeNode3")// Your Condition
            {
                tooltip.set_text("RadTreeNode3");
                tooltip.show();
            }
        }
    </script>

    Hope this helps.

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top