如何使用远程数据获取 Kendo HierarchicalDataSource 的长度？
Posted
技术标签:
【中文标题】如何使用远程数据获取 Kendo HierarchicalDataSource 的长度？【英文标题】：How to get length of Kendo HierarchicalDataSource with remote data? 【发布时间】：2021-10-05 12:07:53 【问题描述】：我正在开发一个 javascript 函数，该函数将使用获取数据的 url 设置 kendo.data.HierarchicalDataSource 对象。在这个函数的最后，如果数据源实际上有数据，我想用数据设置一个树视图（这已经在工作了）。如果它没有数据，而不是设置树视图，我想让一个标签可见，告诉用户没有数据。
我的问题：如何确定 HierarchicalDataSource 中有/没有数据？当我尝试调用任何函数或获取 getData 的任何属性时，它会返回 undefined。
function loadTreeGroupData(applicationId)
var treeview = $("#treeview-kendo").data("kendoTreeView");
var url = $('#urlHolders').data("gettreeUrl");
var appId = 0;
if (applicationId != undefined && applicationId != "")
appId = applicationId;
var getData = new kendo.data.HierarchicalDataSource(
change: function (e)
for (var i = 0; i < e.items.length; i++)
e.items[i].load();
,
transport:
read:
url: url, //"GetAlertsTree",
dataType: "json",
contentType: "application/json",
data: applicationId: appId
,
schema:
model:
id: "id",
hasChildren: "hasChildren",
children: "measureGroups"
);
if (/*the treeview has data*/)
treeview.setDataSource(getData);
else
/*set a label that tells the user that there's no data*/
【问题讨论】：
【参考方案1】：我建议您对代码进行以下更改：
在treeView初始化时设置HierarchycalDataSource，而不是以后再添加；
将 treeView 的 div 和标签声明为 display:none 或以任何方式隐藏它们；
使用DataSource 的requestEnd 事件来显示/隐藏元素。
<!DOCTYPE html>
<html>
<head>
<base href="https://demos.telerik.com/kendo-ui/treeview/remote-data-binding">
<style>html font-size: 14px; font-family: Arial, Helvetica, sans-serif; </style>
<title></title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.2.616/styles/kendo.default-v2.min.css" />
<script src="https://kendo.cdn.telerik.com/2021.2.616/js/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2021.2.616/js/kendo.all.min.js"></script>
</head>
<body>
<div id="example">
<div class="demo-section k-content">
<div id="treeview" style="display: none"></div>
<div id="no-data-label" style="display: none">No data found</div>
</div>
<script>
var serviceRoot = "https://demos.telerik.com/kendo-ui/service";
homogeneous = new kendo.data.HierarchicalDataSource(
transport:
read:
url: serviceRoot + "/Employees",
dataType: "jsonp"
,
schema:
model:
id: "EmployeeId",
hasChildren: "HasEmployees"
,
requestEnd: (e) =>
if (e.response && e.response.length)
$("#treeview").show();
$("#no-data-label").hide();
else
$("#treeview").hide();
$("#no-data-label").show();
);
$("#treeview").kendoTreeView(
dataSource: homogeneous,
dataTextField: "FullName"
);
</script>
</div>
</body>
</html>Dojo
【讨论】：
以上是关于如何使用远程数据获取 Kendo HierarchicalDataSource 的长度？的主要内容，如果未能解决你的问题，请参考以下文章
Kendo UI - JSON 响应 - 使用带有服务器分组和服务器聚合的远程数据源的网格