如何動態綁定kendo mvc ui dropdownlist

Question

我正在使用Kendo UI mvc在asp.net mvc上工作。我有兩個kendo下拉列表。一個用於所選診所的診所名單和另一名患者名單。但是，診所和患者之間沒有使用級聯下拉列表的直接關係。爲此，我在下拉列表更改事件中使用了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

如果要在第一個DropDown值的基礎上填充第二個DropDown。 Telerik的提供，

.CascadeTo("DropDownList2") 

請參閱下面的鏈接瞭解詳細信息。

Cascading of Dropdown in Telerik dropdownlist

Answer 2

而不是創造這樣的陣列是沒用到數據源使用：

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

從我可以告訴，有診所和患者之間的關係，所以你應該能夠使用提供在包裝中的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 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")) 
) 

然後你可以將數據綁定到第二個下拉直接在ajax post的成功函數中。

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）的結果值應包含的新患者的GetPatient控制器屬性基於傳遞給函數的「消息」參數電子郵件「PatId」和「PatName」，還有列表將不需要ddlpatients.reload（），事實上.reload（）不被支持，它會破壞執行，所以不要使用.reload（）。