如何填充 Json 数据以响应 Kendo 下拉列表?
How to Populate Jason Data response to Kendo Dropdown?
我有一个 kendo 下拉列表,我正在尝试使用 ajax jason 响应填充数据。不幸的是,下拉列表显示空白。知道我错过了什么吗?你能帮忙吗?
DIV:
<div class="row form-group spacer">
<div class="col-md-12">
<div class="col-md-12">
@Html.Label("Recipients")
<div id="commentrecipients" class="dirtyignore" name="commentrecipients"></div>
</div>
</div>
</div>
这是我的Ajax电话
function DisplayCommentDialog(EntityOrganizationID) {
$('#commentrecipients').kendoDropDownList({
dataTextField: "Name",
dataValueField: "UserID",
autoBind: false
});
$.ajax({
type: "GET",
url: "/Submission/SecurityGroupsUsersAccessRight",
async: false,
dataType: "JSON",
data: {
id: EntityOrganizationID
},
success: function (data) {
var ddl = $('#commentrecipients').data("kendoDropDownList");
ddl.setDataSource(data);
ddl.refresh();
$('#commentrecipients').show();
}
});
}
杰森回复:
data = "[{"SecurityGroupID":31,"SecurityGroupName":"Permission Testers","UserID":30,"Name":"Dawn Test'Neil"},{"SecurityGroupID":31,"SecurityGroupName":"Permission Testers","UserID":213,"Name":"Dawn 2 Bates"}]"
我稍微改变了方法并使用数据源传输来解决这个问题。按预期工作。下面提供了解决方案。
function DisplayCommentDialog(EntityOrganizationID) {
var categories = $("#commentrecipients").kendoDropDownList({
optionLabel: "Select Recipients...",
dataTextField: "Name",
dataValueField: "UserID",
height: 310,
Width: "900px",
dataSource: {
transport: {
read: function (options) {
$.ajax({
url: "/Submission/SecurityGroupsUsersAccessRight",
dataType: "JSON", // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
data: {
id: EntityOrganizationID
},
success: function (result) {
// notify the data source that the request succeeded
options.success(result);
},
error: function (result) {
// notify the data source that the request failed
options.error(result);
}
});
}
}
}
}).data("kendoDropDownList");
}
我有一个 kendo 下拉列表,我正在尝试使用 ajax jason 响应填充数据。不幸的是,下拉列表显示空白。知道我错过了什么吗?你能帮忙吗?
DIV:
<div class="row form-group spacer">
<div class="col-md-12">
<div class="col-md-12">
@Html.Label("Recipients")
<div id="commentrecipients" class="dirtyignore" name="commentrecipients"></div>
</div>
</div>
</div>
这是我的Ajax电话
function DisplayCommentDialog(EntityOrganizationID) {
$('#commentrecipients').kendoDropDownList({
dataTextField: "Name",
dataValueField: "UserID",
autoBind: false
});
$.ajax({
type: "GET",
url: "/Submission/SecurityGroupsUsersAccessRight",
async: false,
dataType: "JSON",
data: {
id: EntityOrganizationID
},
success: function (data) {
var ddl = $('#commentrecipients').data("kendoDropDownList");
ddl.setDataSource(data);
ddl.refresh();
$('#commentrecipients').show();
}
});
}
杰森回复:
data = "[{"SecurityGroupID":31,"SecurityGroupName":"Permission Testers","UserID":30,"Name":"Dawn Test'Neil"},{"SecurityGroupID":31,"SecurityGroupName":"Permission Testers","UserID":213,"Name":"Dawn 2 Bates"}]"
我稍微改变了方法并使用数据源传输来解决这个问题。按预期工作。下面提供了解决方案。
function DisplayCommentDialog(EntityOrganizationID) {
var categories = $("#commentrecipients").kendoDropDownList({
optionLabel: "Select Recipients...",
dataTextField: "Name",
dataValueField: "UserID",
height: 310,
Width: "900px",
dataSource: {
transport: {
read: function (options) {
$.ajax({
url: "/Submission/SecurityGroupsUsersAccessRight",
dataType: "JSON", // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
data: {
id: EntityOrganizationID
},
success: function (result) {
// notify the data source that the request succeeded
options.success(result);
},
error: function (result) {
// notify the data source that the request failed
options.error(result);
}
});
}
}
}
}).data("kendoDropDownList");
}