Kendo grid dropdownlist issue

Question

I'm using a custom template on one of the column in my kendo grid. Everything is fine, when data retrieve, the dropdownlist show correct value. However when i click on edit command, the row become edit mode and the dropdownlist doesn't show its value. Only when i click on the dropdownlist, the item show selected. What I want is it show out the text when its in edit mode.

Before click edit

After click edit

My code:

function customDdlEditor(container, options) {
    $('<input required data-text-field="text" data-value-field="value"  data-bind="value:' + options.field + '"/>')//data-text-field="text" data-value-field="value" data-bind="value:fieldType"
   .appendTo(container)
   .kendoDropDownList({
       autobinds: false,
       dataTextField: "text",
       dataValueField: "value",           
       dataSource: ddl

   });
 }

var ddl = [{ text: "Text", value: "Text" },
        { text: "Date", value: "Date" },
        { text: "Number", value: "Number"}];

var Grid = $("#grid").kendoGrid({
            dataSource: fieldDataSource,                
            columns: [
        ...
        { field: "type", title: "Type", editor: customDdlEditor, template: "#= type #" },
        ...
        ,
            noRecords: true,
        }).data("kendoGrid");

        var fieldDataSource = new kendo.data.DataSource({
            data: gridData,
            pageSize: 50,
            schema: {
                model: {
                    id: "name",
                    fields: {
                        ...,
                        type: { field: "type"},
                        ...
                    }
                }
            }
        });

Anyone know how to solve this?

Answer 1

If you make your drop down autoBind: true should work.

function customDdlEditor(container, options) {
    $('<input required data-text-field="text" data-value-field="value"  data-bind="value:' + options.field + '"/>')//data-text-field="text" data-value-field="value" data-bind="value:fieldType"
   .appendTo(container)
   .kendoDropDownList({
       autobinds: true, // <-- auto bind true instead
       dataTextField: "text",
       dataValueField: "value",           
       dataSource: ddl

   });
 }