kendo ui dropdown not binding

Question

I am using Kendo UI inline editing with dropdown list. in my code, I get the values as JSON from controller function.

dropdown not binding this JSON data, it shows the error as e.slice is not recognized.

 $("#orderItems-grid").kendoGrid({
        dataSource: datasource,
        columns: [{
            field: "Orderref",
            title: "Order Ref",
            editable: false
        }, {
            field: "ProductRef",
            title: "Product Ref",
            editable: false
        }, {
            field: "ProductNotes",
            title: "Product Notes",
            editable: false
        }, {
            field: "OrderStatusId",
            title: "Order Status",
            template: "#=OrderStatus#",
            editor: function (container) {
                var input = $('<input id="OrderStatusId" name="OrderStatusId">');
            input.appendTo(container);
            input.kendoDropDownList({
                dataTextField: "Value",
                dataValueField: "Key",                    
                dataSource: {
                    transport: {
                        read: {                                
                            url: "/Order/GetOrderStatusListForDD",
                            type: "POST",
                            dataType:"json"
                        }
                    }
                }

            }).appendTo(container);
        }
    },
    { command: { name: "edit", text: "Edit Status" } }],
    editable: "inline"
});

MY JSON result is

{ "16":"Allocated to Picking Queue", "2":"Awaiting Approval", "10":"Awaiting Order to be placed", "9":"Awaiting Stock", "6":"Cancelled", "14":"Cancelled and Product Reset", "7":"Denied", "8":"Discontinued", "11":"Discontinued and Alternative Found", "15":"Invoiced", "1":"Order Received", "3":"Order sent to Supplier", "5":"Shipped", "4":"Storage Area" }

Answer 1

you have twice .appendTo(container). Try this:

editor: function (container, options) {
    $('<input data-bind="value:' + options.field + '"/>')
        .appendTo(container)
        .kendoDropDownList({
            dataTextField: "Value",
            dataValueField: "Key",  
            dataSource: {
                transport: {
                    read: {
                        url: "/Order/GetOrderStatusListForDD",
                        type: "POST",
                        dataType: "json"
                    }
                }
            }
        });
    }

Update: in your GetOrderStatusListForDD() action the result must implement IEnumerable, then return Json(result) will return right JSON