asp.net-mvc 如何动态绑定kendo mvc ui下拉列表
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13175040/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to bind kendo mvc ui dropdownlist dynamically
提问by Karthik Bammidi
I am working on asp.net mvc with Kendo UI mvc. I have two kendo dropdown lists. one for list of clinics and another of list of patients in selected clinic. But there is no direct relationship between clinic and patient to use the cascading dropdownlist. for that i have used ajax calls in dropdownlist change event and get list of patients. and this is my first dropdownlist for list clinics
我正在使用 Kendo UI mvc 开发 asp.net mvc。我有两个剑道下拉列表。一个用于诊所列表，另一个用于选定诊所的患者列表。但是使用级联下拉列表在诊所和患者之间没有直接关系。为此，我在下拉列表更改事件中使用了 ajax 调用并获取了患者列表。这是我列出诊所的第一个下拉列表
@(
Html.Kendo().DropDownList()
.Name("ddlClinics")
.Events(e=>e.Change("ChangeClinic"))
.BindTo(new SelectList((List<Account.Entities.Clinic>)ViewBag.lstClinic,
"ClinicID", "ClinicName")))
and this is my second dropdownlist for listpatients
这是我的第二个列表患者的下拉列表
@(
Html.Kendo().DropDownList()
.Name("ddlPatients")
.BindTo(new SelectList((List<Patient>)ViewBag.Patients,
"PatId", "PatName"))))
I want to dynamically bind the list of patients to second dropdownlist when the first dropdownlist changes,
当第一个下拉列表更改时，我想将患者列表动态绑定到第二个下拉列表，
function ChangeClinic()
{
$.ajax({
url: '/Messages/GetPatient',
type: 'Post',
data: { email: '@User.Identity.Name' },
cache: false,
success: function (result) {
var ddlPatients = $('#ddlPatients').data('kendoDropDownList');
var main = [];
$.each(result, function (k, v) {
main.push({ "PatId": v.PatId, "PatName": v.PatName });
});
ddlPatients.dataTextField = "PatName";
ddlPatients.dataValueField = "PatId";
ddlPatients.dataSource.data(main);
ddlPatients.reload();
}
});
}
i am able to bind the list to dropdownlist but all items are shows as 'undefined'. so please guide me.
我能够将列表绑定到下拉列表，但所有项目都显示为“未定义”。所以请指导我。
回答by Elsimer
From what I can tell, there is a relationship between clinics and patients so you should be able to use the CascadeFrom("DropDownList1")provided in the wrappers. We use a cascading dropdownlist in a similar fashion for the relationship between school districts and schools:
据我所知，诊所和患者之间存在关系，因此您应该能够使用包装器中提供的CascadeFrom("DropDownList1")。我们以类似的方式使用级联下拉列表来处理学区和学校之间的关系：
@(Html.Kendo().DropDownList()
.Name("District")
.HtmlAttributes(new { style = "width:300px;" })
.BindTo(ViewBag.districts)
.DataTextField("DistrictName")
.DataValueField("DistrictID")
.OptionLabel("Select District")
)
@(Html.Kendo().DropDownList()
.Name("School")
.HtmlAttributes(new { style = "width:300px;" })
.CascadeFrom("District")
.BindTo(ViewBag.schools)
.DataTextField("SchoolName")
.DataValueField("SchoolID")
.OptionLabel("Select School")
)
回答by Petur Subev
Instead of creating such array which is useless to the dataSource use:
而不是创建这样对 dataSource 无用的数组，请使用：
success: function (result) {
var ddlPatients = $('#ddlPatients').data('kendoDropDownList');
var main = [];
$.each(result, function (k, v) {
main.push({ "text": v.PatId, "value": v.PatName });
});
ddlPatients.dataSource.data(main);
}
});
回答by Kailas Mane
If you want fill second DropDown on basis of first DropDown value. Telerik Provided,
如果您想根据第一个 DropDown 值填充第二个 DropDown。Telerik 提供，
.CascadeTo("DropDownList2")
Please see following link for detailed information.
有关详细信息，请参阅以下链接。
回答by Shivam657
If you are not using
如果您不使用
.DataSource(source =>
{
source.Read(read =>
{
read.Action ("FunctionName", "ControllerName").Data("filterDropdown1");
}).ServerFiltering(true);
})
.CascadeFrom("Dropdown1")
properties in the definition of second dropdown and you are using the definition mentioned in question above. i.e:-
属性在第二个下拉列表的定义中，并且您正在使用上述问题中提到的定义。IE：-
@(
Html.Kendo().DropDownList()
.Name("ddlPatients")
.BindTo(new SelectList((List<Patient>)ViewBag.Patients,"PatId", "PatName"))
)
then you can bind the data to the 2nd dropdown directly in the success function of ajax post.
然后你可以直接在ajax post的success函数中将数据绑定到第二个下拉列表。
function ChangeClinic()
{
$.ajax({
url: '/Messages/GetPatient',
type: 'Post',
data: { email: '@User.Identity.Name' },
cache: false,
success: function (result) {
$('#ddlPatients').data('kendoDropDownList').dataSource.data(result);
//ddlPatients.reload();
}
});
}
@Note:- 1) The result value should contain the list of new patients with properties "PatId" and "PatName" based on the parameter email passed to the function "Messages" in GetPatient controller, and there will be no need for ddlpatients.reload(), infact .reload()is not supported, it will break the execution, so don't use .reload().
@注意：- 1) 结果值应包含基于传递给 GetPatient 控制器中函数“Messages”的参数 email 的具有属性“PatId”和“PatName”的新患者列表，并且不需要 ddlpatients。 reload()，实际上不支持.reload()，它会中断执行，所以不要使用.reload()。
