Reference controls from javascript

[richard]

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

[Svetlina Anati]

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

[richard]

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);
}

[richard]

Also!
the .NodeExpand event does not fire :(

[richard]

not shown in the above code but I also have these properties set

newNode.ExpandMode = TreeNodeExpandMode.ServerSideCallBack;

newNode.PostBack = false;

 

 

[Dobromir]

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