Reference controls from javascript

6 posts, 0 answers
  1. richard
    richard avatar
    38 posts
    Member since:
    May 2011

    Posted 10 Jan 2012 Link to this post

    Hello
    I am trying to reference controls inside a sliding zone.

    I have multiple panes.
     I have worked out how to access the active/docked pane (as) below; but I don't know how to reference the treeview control that is inside the pane.  I tried controls[0] but there doesn't seem to be a controls property.

    Th following obtains reference to the Pane ok, but fails on the second line trying to get the treeview
    var myPane = $find("<%= ExploreSlidingZone.ExpandedPaneId%>");
     
    var treeView = myPane.controls[0];

    Please can anyone help
    Richard
  2. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 10 Jan 2012 Link to this post

    Hi richard,

    You can directly reference the treeview inside the RadSlidingPane without the need to reference the zone or the sliding pane itself, e.g as shown below:
     

    var treeview = $find("<%=RadTreeView1.ClientID %>");


    This approach will work for referencing any RadControls in a splitter, as far as the following two conditions are true:

    1) The content is on the same page - this is true for all cases except for content inside RadPane, loaded through the ContentUrl property.

    2) You reference the control when it has been fully initialized which means  after pageLoad has finished.

    I hope that my reply is detailed enough and helpful, let me know in case you have additional questions.

    Greetings,
    Svetlina Anati
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. richard
    richard avatar
    38 posts
    Member since:
    May 2011

    Posted 10 Jan 2012 Link to this post

    Hello Svetlina
    thank you for you reply - but I don't know the ID of the treeview?
    (there are multiple sliding panes each containing a tree view).

    I am creating multiple panes in a sliding zone in a loop as below:
       foreach (XmlNode xn in xnList)
       {
           // Create a new sliding pane
            
           RadSlidingPane leftSlidingPane = new RadSlidingPane();
            
           leftSlidingPane.Title = xn["label"].InnerText;
           leftSlidingPane.Overlay = true;
           leftSlidingPane.MinWidth = 50;
           leftSlidingPane.Width = 300;
     
           ExploreSlidingZone.Items.Add(leftSlidingPane);
            
           // Create radtree
           RadTreeView MyTree = new RadTreeView();
           MyTree .OnClientNodeClicking = "ClientNodeClicking";
           MyTree .ShowLineImages = true;
           MyTree .NodeExpand += new RadTreeViewEventHandler(RadPopulateNode);
     
           // add the root TreeNode
           RadTreeNode ExploreRootNode = new RadTreeNode(" " + xn["label"].InnerText);
           MyTree .Nodes.Add(ExploreRootNode);
     
           ExploreRootNode.Toggle();
            
           // Add treeview to sliding pane
           leftSlidingPane.Controls.Add(myTree);
    }

  5. richard
    richard avatar
    38 posts
    Member since:
    May 2011

    Posted 10 Jan 2012 Link to this post

    Also!
    the .NodeExpand event does not fire :(
  6. richard
    richard avatar
    38 posts
    Member since:
    May 2011

    Posted 10 Jan 2012 Link to this post

    not shown in the above code but I also have these properties set
    newNode.ExpandMode = TreeNodeExpandMode.ServerSideCallBack;
      
    newNode.PostBack = false;

     

     

  7. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 12 Jan 2012 Link to this post

    Hi Richard,

    It is possible to get the reference of the client-side object of RadControl without knowing its ID using the following approach:
    var myPane = $find("<%= ExploreSlidingZone.ExpandedPaneId%>");
     
    var contentElement = myPane.getContentContainer();
    var treeViewWrapper = $telerik.$("#" + contentElement.id + " > .RadTreeView").get(0);
     
    var treeView = treeViewWrapper.control;

    Regarding the NodeExpand server-side event, I am not quite sure why it is not fired. I have created a sample page from the provided code snippet and the event is fired. I have attached my test page, could you please modify it to a point where the problem occurs and send it back?

    Kind regards,
    Dobromir
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017