绑定Telerik RadTreeView客户端

时间:2011-10-18 00:32:30

标签: c# javascript asp.net telerik radtreeview

我有一个javascript对象数组,我想用它来填充RadTreeView。 除了为我的对象集合手动编写自己的绑定方法之外,我无法弄清楚如何从客户端实现此目的。

我的javascript数组中的每个对象都有

标识 的ParentId 值 文本

是否无法从客户端的此javascript数据结构自动填充整个树? 我必须1比1做这个吗?通过遍历我的数组并递归下去树?

我正在使用Web服务来获取带有此数据的JSON对象,我想完全构建树,而不仅仅是在展开的节点上。

2 个答案:

答案 0 :(得分:5)

显然,没有办法从客户端绑定整个树。您可以做的最多是绑定第一级节点,当用户点击每个节点时,您可以填充子节点进行另一个Web方法调用。

<telerik:RadTreeView OnClientNodeClicking="PopulateChild" DataTextField="Text" 
                            ID="datesTree" runat="server">
                            <WebServiceSettings Path="../AcmeWebService.asmx" Method="GetRootNodes" />
  <Nodes>
    <telerik:RadTreeNode Text="Root Node" ImageUrl="../images/truckicon.png"  ExpandMode="WebService" />
  </Nodes>
</telerik:RadTreeView>

您的GetRootNodes方法如下所示:

[WebMethod, ScriptMethod]
public RadTreeNodeData[] GetRootNodes(RadTreeNodeData node, object context)
{
    DataTable productCategories = GetProductCategories(node.Value);
    List<RadTreeNodeData> result = new List<RadTreeNodeData>();
    foreach (DataRow row in productCategories.Rows)
    {
        RadTreeNodeData itemData = new RadTreeNodeData(); 
        itemData.Text = row["Title"].ToString(); 
        itemData.Value = row["CategoryId"].ToString();
        if (Convert.ToInt32(row["ChildrenCount"]) > 0) 
        { 
            itemData.ExpandMode = TreeNodeExpandMode.WebService; 
        }
        result.Add(itemData);
    }
    return result.ToArray();
}

PopulateChild客户端方法可以是:

function PopulateChild(sender, args) {
var treeView = $find('datesTree');

    var nodeText = "";

    $.ajax({
        type: "POST",
        url: "../AcmeWebService.asmx/GetChildNodes",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: "{'nodeText': '" + nodeText + "','nodeValue': '" + args.get_node().get_value() + "','param2':'" + treeView.get_allNodes()[0].get_value() + "' }",
        success: function(msg) {
            if (treeView != null) {
                treeView.trackChanges();
                var parent = treeView.get_selectedNode() || treeView;
                var count = parent.get_nodes().get_count();
                for (var i = 0; i < msg.d.length; i++) {
                    var node = new Telerik.Web.UI.RadTreeNode();                                                
                    node.set_text(msg.d[i].Text);
                    node.set_value(msg.d[i].ParentID);
                    node.set_expanded(true);
                    parent.get_nodes().add(node);
                }
                treeView.commitChanges();
            }
        }
    });

}

在填充子节点的Web服务方法上可以是:

[WebMethod, ScriptMethod]
public IEnumerable<YourNode> GetChildNodes(string nodeText, string nodeValue, int param2)
{
   //call your DAL with any parameter you passed in from above
   IEnumerable<YourNode> nodes = ...
   return nodes;
}

注意0 上述方法不会返回RadTreeNodeData数组。它可以是您自己的自定义对象的任何集合。同样适用于GetRootNodes只是我从Telerik的网站上复制了那个;)

注1:我曾经有过类似的情况,我最初使用这种技术加载第一级节点,并在客户端点击时加载其他节点。我在这里发布的一些代码是我原始代码的精简版。

我希望它有所帮助。

答案 1 :(得分:2)

根据文档,客户端Nodes属性是只读的:

The RadTreeView client object