CODEWITHSUNDEEP
javascriptjqueryajaxdrop-down-menukendo-ui
Marcin Grzegorczyk
Marcin Grzegorczyk

Reputation: 129

Kendo DropDownList select value after AJAX

I try to select DropDownList value after data from AJAX come, but my solution doesn't work Here is my code:

function openWindow(e) {
    var wdw = $("#myWindow").data("kendoWindow");
    wdw.open();
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    var grid = $("#grid").data("kendoGrid");
    grid.dataSource.transport.options.read.url = '@Url.Action("BindingList", "AttributeBinding")' + "?formId=" + dataItem.FormId;
    grid.dataSource.read();
    $("#title").html(dataItem.FormTitle);
    $("#dropdown").kendoDropDownList({
        optionLabel: "- please select -",
        dataTextField: "StringValue",
        dataValueField: "Id",
        dataSource: {
            transport: {
                read: {
                    url: '@Url.Action("PopUpBind", "AttributeBinding")',
                    dataType: "json",
                },

            },
            requestEnd: function () {
                $("#dropdown").data('kendoDropDownList').value(dataItem.MultiLinkerProductAttributeId);
            }
        }
    });

};

When DropDown is loaded I can set #dropdown value by Web Browser console, but this same code doesn't work with requestEnd function in dataSource

Upvotes: 2

Views: 2713

Answers (1)

OnaBai
OnaBai

Reputation: 40917

Event requestEnd in the DataSource is fired when the request of the data is completed but the data doesn't have to be bound to the widget. Since the selection refers to the widget (DropDownList) you should use dataBound

Your code would be something like:

function openWindow(e) {
    var wdw = $("#myWindow").data("kendoWindow");
    wdw.open();
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    var grid = $("#grid").data("kendoGrid");
    grid.dataSource.transport.options.read.url = '@Url.Action("BindingList", "AttributeBinding")' + "?formId=" + dataItem.FormId;
    grid.dataSource.read();
    $("#title").html(dataItem.FormTitle);
    $("#dropdown").kendoDropDownList({
        optionLabel: "- please select -",
        dataTextField: "StringValue",
        dataValueField: "Id",
        dataSource: {
            transport: {
                read: {
                    url: '@Url.Action("PopUpBind", "AttributeBinding")',
                    dataType: "json",
                },

            }
        },
        dataBound: function(e) {
            this.value(dataItem.MultiLinkerProductAttributeId);
        }
    });

};

Upvotes: 4

Related Questions