在Kendo UI網格內使用Multiselect時出錯？

Question

我想在劍道網格中使用多選。 我在我的應用程序中遵循jsFiddle演示http://jsfiddle.net/OnaBai/Q2w7z/中的示例，如下所示：

var _weekdays = ["MONDAY", "TUESDAY", "WEDNESDAY", "THURSDAY", "FRIDAY", "SATURDAY", "SUNDAY"];       

    function weekDaysEditor(container, options) {
        $("<select multiple='multiple' data-bind='value : weekDays'/>")
                .appendTo(container)
                .kendoMultiSelect({
                    dataSource: _weekdays
                });
    }

    function DeviceAlarm() {
        var crudServiceBaseUrl = "/Ajax/AjaxHandler.aspx?";
        dataSource = new kendo.data.DataSource({
            transport: {
                read: {
                    url: crudServiceBaseUrl + "requesttype=GetDeviceAlarms&id=xyz",
                    dataType: "json"
                },

                update: {
                    url: crudServiceBaseUrl + "requesttype=UpdateDeviceAlarm",
                    dataType: "json"
                },

                parameterMap: function (options, operation) {
                    if (operation !== "read" && options.models) {
                        return { models: kendo.stringify(options.models) };
                    }
                }
            },
            batch: true,
            pageSize: 20,
            schema: {
                model: {
                    id: "alarmId",
                    fields: {
                        DeviceAlarmKey: { editable: false, nullable: true },
                        fitbitid: { editable: false, nullable: true },
                        DeviceId: { editable: false, nullable: true },
                        alarmId: { editable: false, nullable: true },
                        deleted: { type: "boolean" },
                        enabled: { type: "boolean" },
                        label: { editable: true, nullable: true },
                        recurring: { type: "boolean" },
                        snoozeCount: { editable: true, nullable: true },
                        snoozeLength: { editable: true, nullable: true },
                        syncedToDevice: { editable: false, nullable: true },
                        time: { editable: true, nullable: true },
                        vibe: { editable: true, nullable: true },
                        weekDays: { editable: true, nullable: true }
                    }
                }
            }
        });

        $("#Devices_Figures").kendoGrid({
            dataSource: dataSource,
            pageable: true,
            height: 400,
            toolbar: ["create"],
            columns: [
            {
                field: "time",
                title: "Time",

                width: 100
            },
            {
                field: "deleted",
                title: "Deleted",
                width: 80
            },
            {
                field: "enabled",
                title: "Enabled",
                width: 80
            },

            {
                field: "label",
                title: "Label",
                width: 110
            },
            {
                field: "recurring",
                title: "Recurring",
                width: 80
            },
            {
                field: "snoozeCount",
                title: "Snooze Count",
                width: 110
            },
            {
                field: "snoozeLength",
                title: "Snooze Length",
                width: 110
            },

            {
                field: "vibe",
                title: "vibe",
                width: 100
            },
            {
                field: "weekDays",
                title: "weekDays",
                editor: weekDaysEditor,
                width: 150,
                template: "#= weekDays.join(', ') #"
            },
            { command: ["edit", "destroy"], title: "&nbsp;", width: "200px" }],
            editable: "popup"

        });

    }

但它在一行顯示一個錯誤

模板：“＃= weekDays.join（'，'）＃”

未捕獲的TypeError：undefined不是函數

什么原因？

Answer 1

這可能是您在dataSource中聲明工作日的方式

這會拋出未定義的不是函數

var dataSource = [
     { "weekDays": 'Wed'}
];

但是，如果將weekDays聲明為數組，它將起作用。

var dataSource = [
     { "weekDays": ['Wed']}
];

http://jsbin.com/yacakema/1/edit?js，輸出

Answer 2

問題出在模板上。 對於新記錄，工作日為“”。 所以聯接給了異常，所以我將其更改為

template: "#= weekDays =='' ? '': weekDays.join('; ') #",

及其工作正常