在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('; ') #",

及其工作正常