编辑器网格中的自定义类型存储字段未正确映射

时间:2012-01-04 08:33:14

标签: javascript extjs extjs4 extjs3

我有一个编辑网格和一个自定义类型的商店。

商店:

var sourceStore = new Ext.data.JsonStore({
    url: hp,
    storeId: 'labels-data-store',
    idProperty: 'ID',
    root: 'results',
    fields: [{
        name: 'ID',
        type: 'int'
    }, {
        name: 'LanguageID',
        type: 'int'
    }, {
        name: 'KeyID',
        type: 'int'
    }, {
        name: 'Value',
        type: 'string'
    }, {
        name: 'ToolTip',
        type: 'string'
    }, {
        name: 'LanguageName',
        type: 'string'
    }, {
        name: 'KeyInfo',
        type: 'LanguageKeyInfo'
    },
    CUSTOM TYPE HERE !! !{
        name: 'ServerComments',
        type: 'string'
    }]
});

编辑网格:

var sourceGrid = new Ext.grid.EditorGridPanel({
    id: 'source-grid',
    region: 'center',
    title: localize.sourceView,
    iconCls: 'source-view-title',
    store: sourceStore,
    trackMouseOver: true,
    disableSelection: false,
    loadMask: true,
    split: true,
    stripeRows: true,
    border: true,
    autoExpandColumn: 'label',
    cm: sourceColModel,

    // customize view config
    viewConfig: {
        forceFit: true,
        enableRowBody: true,
        showPreview: false,
        emptyText: localize.noRecordsFound
    },

    sm: new Ext.grid.RowSelectionModel({
        singleSelect: false,
        moveEditorOnEnter: true
    })
});

客户类型实施:

LanguageKeyInfo = function () {
    this.ID = arguments[0];
    this.Value = arguments[1];
    this.Description = arguments[2];
}

Ext.data.Types.LANGUAGEKEYINFO = {
    convert: function (v, data) {

        if (!data) {
            return null;
        }

        if (!data.KeyInfo) {
            return null;
        }

        return new LanguageKeyInfo(
        data.KeyInfo.ID,
        data.KeyInfo.Value,
        data.KeyInfo.Description);
    },

    sortType: function (key) {
        return key.ID;
    },

    type: 'LanguageKeyInfo'
}

源列模型:

var sourceColModel = new Ext.grid.ColumnModel({
    columns: [{
        header: 'ID',
        dataIndex: 'ID',
        width: 50,
        hidden: true,
        sortable: true
    }, {
        header: 'Language ID',
        dataIndex: 'LanguageID',
        width: 50,
        hidden: true,
        sortable: true
    }, {
        header: 'Language',
        dataIndex: 'LanguageName',
        width: 20,
        hidden: true,
        sortable: true
    }, {
        header: 'Key ID',
        dataIndex: 'KeyID',
        width: 30,
        hidden: true,
        sortable: true
    }, {
        header: 'Key',
        dataIndex: 'KeyValue',
        width: 40,
        sortable: true,
        editor: new Ext.form.TextField({
            allowBlank: false,
            maxLength: 200
        })
    }, {
        header: 'Label',
        dataIndex: 'Value',
        sortable: true,
        editor: new Ext.form.TextField({
            allowBlank: false,
            maxLength: 500
        }),
        renderer: function (sc) {
            var lanID = getSelectedLanguageID() ? getSelectedLanguageID() : 1;
            switch (parseInt(lanID)) {
                case 2:
                    return '<div class="rtl">' + sc + '</div>';
                default:
                    return sc;
            }
        }
    }, {
        header: 'Description',
        dataIndex: 'KeyDescription',
        width: 30,
        editor: new Ext.form.TextField({
            allowBlank: true,
            vtype: 'englishOnly',
            maxLength: 100
        })
    }, {
        header: 'Tool Tip',
        dataIndex: 'ToolTip',
        width: 80,
        sortable: true,
        editor: new Ext.form.TextField({
            allowBlank: true,
            maxLength: 200
        })
    }]
});

当我开始编辑第一列行时,文本字段值是[object,object],这意味着网格将KeyInfo对象传递给文本框值。

如何将KeyInfo属性之一发送到文本框并将其映射到商店记录?

1 个答案:

答案 0 :(得分:0)

对于初学者,您的dataIndex不引用有效的记录映射: dataIndex: 'KeyValue',应该是dataIndex: 'KeyInfo', 其次,我认为网格编辑器上的自定义类型没有任何支持。我当然可能错了。