Question

我有一个Kendo下拉列表控件，我在页面的初始加载时通过SelectList填充。

@(Html.Kendo().DropDownListFor(m => m.AssociatedWithType)
    .Events(x => x.Select("CR.TodoAddEditDialog.AssociatedWithSelected"))
    .Value(ViewBag.AssociatedWithTypesId)
    .BindTo(ViewBag.AssociatedWithTypesSelectList)
)

@(Html.Kendo().DropDownListFor(m => m.AssociatedWithId)
   .BindTo(ViewBag.AssociatedWithIdsSelectList)
)

这一切都很好，但我需要在第一个下拉列表更改值时重新加载数据。我有以下javascript：

AssociatedWithSelected: function(e) {
    var dataItem = this.dataItem(e.item.index());

    var associatedWithIdsDropDown = $("#todoAddEditDialogForm #AssociatedWithId").data("kendoDropDownList"); 
    var url = settings.getAssociatedWithIdsUrl + "?associatedWithType=" + dataItem.Text;
    associatedWithIdsDropDown.dataSource.read({
        url: url
    });
}

然而，没有任何东西被召唤。

我怀疑是因为我从未在下拉列表中定义dataSource，但我不知道如何在MVC部分中定义一个数据源而不使用它来初始填充列表。

有什么想法吗？

Answer 1

不要使用viewbag绑定模型。下面是你如何从服务器上做到这一点。

 @(Html.Kendo().DropDownListFor(x => x.FromOpportunity)
          .Name("OpportunityDDL")                 
          .DataTextField("OpportunityName")              
          .DataValueField("OpportunityId")                         
          .DataSource(source => {
              source.Read(read =>
               {
                   read.Action("GetOpportunityListByAccount", "CrmIntegration")
                      .Data("OnAdditionalData");
               })
                . ServerFiltering(true);
          })             
          .HtmlAttributes( new { style = "margin-left:13px; width: 275px;" })

控制器这是有点伪编码但基本上返回一个Json列表

List<OpportunityViewModel> oppVMList = new List<OpportunityViewModel>();
        var oppList = new OrderManager().GetOpportunitiesByAccount(Id); 

        foreach (var op in oppList)
        {
            OpportunityViewModel opvm = new OpportunityViewModel();
            opvm.OpportunityId = op.OpportunityId;
            opvm.OpportunityName = op.OpportunityName;

            oppVMList.Add(opvm);
        }

    return Json(oppVMList , JsonRequestBehavior.AllowGet);

并刷新ddl

 var opportunity = $("#OpportunityDDL").data("kendoDropDownList");
        opportunity.dataSource.read({ Id: advertiserId });

您的参数名称必须为Id

任何问题只是问：）

这是我的OnAdditionalData的JS函数，基本上它是在读取控制器方法GetOpportunityListByAccount

之前使用此函数来获取参数

function OnAdditionalData() {

    var dataItem = $("#Advertisers").data("kendoMultiSelect").value();

    return {
        //call would not work when expecting a Guid, 
        //now it expects a string            
        Id: "" + dataItem
    };
}

Answer 2

我最终这样做了，这似乎有效。使用Kendo绑定可能有更好的方法，但我仍然没有弄清楚如何。

AssociatedWithSelected: function(e) {
    var dataItem = this.dataItem(e.item.index());

    var associatedWithIdsDropDown = $("#todoAddEditDialogForm #AssociatedWithId").data("kendoDropDownList");

    var url = settings.getAssociatedWithIdsUrl + "?associationType=" + dataItem.Text;
    $.ajax({
        url: url
    })
    .done(function (response) {
        associatedWithIdsDropDown.dataSource.data(response);
    });
}

Answer 3

我假设您正在寻找如何创建级联DropDownList。我建议你使用涵盖here的方法。

Kendo MVC如何在初始SelectList之后使用AJAX重新填充下拉列表？

3 个答案: