2015-09-23 34 views
0

我試圖將我從控制器操作方法獲得的值返回到劍道樹視圖,以便將模塊名稱作爲劍道樹視圖中的父節點進行渲染。將遠程數據綁定到劍道樹視圖

public ActionResult LoadTreeView([DataSourceRequest] DataSourceRequest request) 
    { 
     using (var countryvar = new TGSFMSSys_UserEntities()) 
     { 
      IQueryable<Module> module = countryvar.Modules; 
      DataSourceResult result = module.ToDataSourceResult(request, value => new Module 
      { 
       ModuleId = value.ModuleId, 
       ModuleName = value.ModuleName 

      }); 
      return Json(result, JsonRequestBehavior.AllowGet); 
     } 
    } 

下面是劍道樹視圖中的Javascript代碼,我創建

<script> 
    $("#treeview").kendoTreeView({ 
     checkboxes: { 
      checkChildren: true 
     }, 
     check: onCheck, 
     dataSource: 
     { 
      transport: { 
       read: '/MapModuleTask/LoadTreeView' 
      } 
     }, 
     dataTextField: 'ModuleName' 
    }); 
</script> 

回答

0

請與下面的代碼片段嘗試。

控制器:HomeController.cs

public JsonResult LoadTreeView(int? id) 
{ 
    List<Module> modules = new List<Module>(); 

    int temp = id.GetValueOrDefault(); 

    modules.Add(new Module() { ModuleId = 1 + temp, ModuleName = "Name1_" + temp , hasChildren = false }); 
    modules.Add(new Module() { ModuleId = 2 + temp, ModuleName = "Name2_" + temp, hasChildren = true }); 

    return Json(modules, JsonRequestBehavior.AllowGet); 
} 

型號:

public class Module 
{ 
    public int ModuleId { get; set; } 
    public string ModuleName { get; set; } 
    public Boolean hasChildren { get; set; } 
} 

查看:

<div id="treeview"></div> 
<script> 

    var datasource = new kendo.data.HierarchicalDataSource({ 
     transport: { 
      read: function (options) { 
       var id = options.data.ModuleId; 
       $.ajax({ 
        url: '/Home/LoadTreeView', 
        dataType: "json", 
        data: { id: id }, 
        success: function (result) { 
         options.success(result); 
        }, 
        error: function (result) { 
         options.error(result); 
        } 
       }); 
      } 
     }, 
     schema: { 
      model: { 
       id: "ModuleId", 
       hasChildren: "hasChildren" 
      } 
     } 
    }); 

    $("#treeview").kendoTreeView({ 
     checkboxes: { 
      checkChildren: true 
     }, 
     dataSource: datasource, 
     dataTextField: 'ModuleName' 
    }); 
</script> 

讓我ķ現在如果有任何顧慮。

+0

謝謝@Jayesh這段代碼工作正常... Thanx再次:) – GMB