Kendo dropdown rebind using jquery

2019-07-13 12:29发布

问题:

I am trying to bind a list of SelectList Items to a Kendo dropdown in jquery using dropDown.setDataSource(result) event. But the issue is, the data displayed in the drop-down is showing as [object object].

 $(document).ajaxStop(function () {
        var exportTypeDropDown = $("#exportTypeDropDown").data("kendoDropDownList");
        if (dropDownLoaded == false && exportTypeDropDown!=null) {
            dropDownLoaded = true;
                var url = "@Url.Action("GetExportTypes", UiControls.ControllerName)";
                $.ajax({
                    url: url,
                    type: "POST",
                    traditional: true,
                    success: function (result) {
                        exportTypeDropDown.setDataSource(result);
                    }
                });
        }
    });

回答1:

Try this, This is just example,

       @Html.DropDownList("CustomerId", (SelectList)ViewBag.CustomerNameID, "--Select--")

 @(Html.Kendo().DropDownList()
            .Name("ddlSearchPNResults")
            .DataTextField("Text")
            .DataValueField("Value")
            .AutoBind(false)
                    .CascadeFrom("CustomerId"))

Script

 $(document).ready(function () {
        $("#CustomerId").change(function () {

            var ddl = $('#ddlSearchPNResults').data("kendoDropDownList");
            var Id = $("#CustomerId").val();

            $.ajax({
                url: '@Url.Action("GetCustomerNameWithId", "Test")',
                type: "Post",
                data: { CustomerNameId: Id },
                success: function (listItems) {

                    ddl.setDataSource(listItems);
  }


            });

            });
 });

Controller

 public JsonResult GetCustomerNameWithId(string CustomerNameId)
        {
            int _CustomerNameId = 0;
            int.TryParse(CustomerNameId, out _CustomerNameId);
            var listItems = GetCustomerNameId(_CustomerNameId).Select(s => new SelectListItem { Value = s.CID.ToString(), Text = s.CustomerName }).ToList<SelectListItem>();
            return Json(listItems, JsonRequestBehavior.AllowGet);
        }

It's perfectly working.



回答2:

That is because kendo doesn't know which property of SelectListItems object you want to bind with dropdown Value and Text.

$('#exportTypeDropDown').kendoDropDownList({
    dataTextField: "Text",
    dataValueField: "Value",
    autoBind: false
});

Make sure you are doing this before setting its dataSource.