I have three questions regarding the jQuery tree. I am using MVC3 and razor.
I have set up the tree using code in the controller:
TreeModel treeModel1 = new TreeModel();treeModel1.ID = "TreeInController1";// Configure data sourcetreeModel1.DataSource = col1;
// Configure specific display and interraction propertiestreeModel1.LoadOnDemand = true;treeModel1.DataSourceUrl = Url.Action("TreeGetData");treeModel1.CheckboxMode = CheckboxMode.TriState;treeModel1.SingleBranchExpand = true;treeModel1.ParentNodeImageUrl = "Computer.png";treeModel1.LeafNodeImageUrl = "Computer.png";
// Define bindingstreeModel1.Bindings = new TreeBindings();treeModel1.Bindings.TextKey = "Name";treeModel1.Bindings.PrimaryKey = "StateId";treeModel1.Bindings.ValueKey = "StateId";//treeModel1.Bindings.ImageUrlKey = "ImageUrl";treeModel1.Bindings.ChildDataProperty = "Courts";
1) How do you set the child leaves Bindings using code in the controller?
2) How do you change the icon of a distinct leaf item using code in the controller?
3) How do you return the selected items to the controller?
Hi there,
Thank you for using the Infragistics Tree control. To answer your questions:
1. The Bindings model has a recursive definition. That means that every Bindings model can have Bindings defined, which is the definition for the child level bindings.
2. You cannot use the LeafNodeImageUrl property to define an image for a distinct leaf item. However the data can carry ImageUrl for a distinct item and so you can configure the ImageUrlKey in the corresponding level of bindings and have the icon displayed for that item.
3. There is no out of the box method of delivering the selected item back to the controller. However you can define a controller action that takes as an argument some specific property of the item and have a button/event handler/etc which calls the action with the parameter that you want to pass to the controller (in this case the selected item.
Let me know if this information helps in any way!
Thanks.
I would still like some help with issue 3. I understand that is what needs to be done, I just need to see an example of how to do it. All the Infrgistics jQuery examples are about grabbing and displaying data and I couldn't find one example showing how to get the data back into the controller.
Hi Jadem,
Could please brief on how to pass the selected nodes list to controller. About Controller Method and Java Script funct. It will be greatly helpful to me.
Thank you.
The checkedNodes method returns a javascript array of node objects. The node objects themselves look like this:
[{path: 'Path_string', element: jQuery_Object, data: Object, binding: Object}]
You don't need to transmit the entire object. If you want to send the node to the server using a specific key to recognize it, then the path string would suffice (node_array[index].path). If you need specific data member to recognize the node, which is a more common scenario, then you extract it from the data object (node_array[index].data.dataMemberKey) and send that to the server. The binding object holds the bindings defined for the specific level of the tree, while the jQuery element is used to reference the node's corresponding DOM element and its children from client code.
I hope this explanation clears it for you somewhat. Feel free to ask if there is anything else unclear and thank you for using the forums!
Normal 0 false false false EN-US X-NONE X-NONE
I just:
var nodes = $("#Tree1").igTree("checkedNodes");
Tree1: JSON.stringify(nodes),
I had to Jsonfy the array so I wouldn’t get an error passing it to the controller.
The infragistics notes only say “returns an array”. I was hoping it was a Infragistics class so I wouldn’t need to create a custom class.
Hi again,
In terms of Javascript this is just an object. You can define a serializable object in your model/controller which maps the properties of the javascript object that you're having. Also did you extract this from the selected node or is this some custom object that you have created?
Looking forward to your reply!
I figured it out.
Btw, what type of object is this?
name "[{\"path\":\"1_5100\",\"element\":{\"0\":{},\"context\":{},\"length\":1},\"data\":{\"Name\":\"San Diego\",\"CityId\":5100},\"binding\":{\"textKey\":\"Name\",\"primaryKey\":\"CityId\",\"valueKey\":\"CityId\"}},{\"path\":\"1_5101\",\"element\":{\"0\":{},\"context\":{},\"length\":1},\"data\":{\"Name\":\"Sacramento\",\"CityId\":5101},\"binding\":{\"textKey\":\"Name\",\"primaryKey\":\"CityId\",\"valueKey\":\"CityId\"}}]" string