在Kendo UI Grid中使用Multiselect时出错?

时间:2014-07-11 17:49:19

标签: jquery ajax kendo-ui

我想在我的剑道网格中使用多选。我正在关注我的应用程序中的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不是函数

是什么原因?

2 个答案:

答案 0 :(得分:0)

这可能是你在dataSource中声明工作日的方式

这将抛出undefined不是函数

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

但是如果将weekDays声明为数组,它将起作用。

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

http://jsbin.com/yacakema/1/edit?js,output

答案 1 :(得分:0)

问题在于模板。对于新记录,工作日是&#34;&#34;。所以连接给出了异常,所以我把它改成了

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

及其正常工作