如何剑道MVC UI下拉列表动态绑定(How to bind kendo mvc ui dropdo

2019-08-02 04:31发布

我的工作与剑道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")))

这是我第二次listpatients下拉列表

@(
 Html.Kendo().DropDownList()
.Name("ddlPatients")
.BindTo(new SelectList((List<Patient>)ViewBag.Patients, 
"PatId", "PatName"))))

我想的患者名单动态绑定到第二个下拉列表第一下拉列表发生变化时,

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();
 }
 });
}

我能够绑定列表下拉列表,但所有项目都显示为“未定义”。 所以请指导我。

Answer 1:

从我所知道的,有诊所和患者之间的关系,所以你应该能够使用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")
)


Answer 2:

而不是创建这样排列的无用则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);
 }
 });


Answer 3:

如果你想填补第一个下拉列表值的基础上第二个下拉。 Telerik的提供,

.CascadeTo("DropDownList2")

请参阅下面的链接了解详细信息。

下拉的下拉列表Telerik的级联



Answer 4:

如果你不使用

.DataSource(source =>
                        {
                            source.Read(read =>
                            {
                                read.Action        ("FunctionName", "ControllerName").Data("filterDropdown1");
                            }).ServerFiltering(true);
                        })
.CascadeFrom("Dropdown1")

在第二个下拉的定义的属性和使用的是有问题上述的定义。 即: -

@(
 Html.Kendo().DropDownList()
.Name("ddlPatients")
.BindTo(new SelectList((List<Patient>)ViewBag.Patients,"PatId", "PatName"))
)

那么你可以直接在阿贾克斯后的成功,函数将数据绑定到第二个下拉列表。

    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)的结果值应包含新患者属性“PatId”,并基于传递到GetPatient控制器功能“消息”参数电子邮件“PatName”列表中,就没有必要ddlpatients。重装(),事实上.reload()不支持,这将打破执行,所以不要用.reload()。



文章来源: How to bind kendo mvc ui dropdownlist dynamically