2

だから私は2つの列を持つグリッドを持っています.1つ目はテキストだけで、2つ目はカスタムコントロール(チェックボックスとコンボボックス付き)が必要です.

スクリーンショットを確認してください:

スクリーンショットへのリンクは次のとおりです。 スクリーン

問題: _

更新をクリックして行を更新すると。最初の列は更新されますが、2 番目の列は更新されません

私は単純にカスタムコントロールに を追加しましたgetValue()が、うまくいきません!! （注：行編集プラグインを使用しています）

これが私のコードです：

Ext.define('MainGrid', {
    extend: 'Ext.grid.Panel',
    //defs for all the toolbars and buttons
    plugins: [rowEditing],
    columns: [
                {
                    xtype: 'rownumberer'
                },
                {
                    xtype: 'gridcolumn',
                    text: 'Column Titles',
                    dataIndex: 'ColumnTitle',
                    editor: {
                        xtype: 'textfield',
                    }
                },
                {
                    xtype: 'gridcolumn',
                    sortable: false,
                    align: 'center',
                    dataIndex: 'IssueCondition',
                    editor: {
                        xtype: 'reportpopulation'
                    }]
});

これreportpopulationがカスタム コントロールです。そのコードは次のとおりです。

Ext.define('SelectPopulation', {
    extend: 'Ext.container.Container',
    itemId: 'ctrSelectpopulation',
    alias: 'widget.reportpopulation',
    layout: {
        type: 'hbox'
    },
    initComponent: function () {
      //code to add combo box and checkbox snipped
      ....
    },
    getValue: function () {
        //This doesn't work! 
        return "Booo";
    }
});

したがって、[更新] をクリックしても次のことは行われません。

  • 足りないものはありますか？
  • FieldBase から継承する必要がありますか? 複数のコントロールを使用して、FieldBase でスクリーンのようなものを作成できますか?
4

1 に答える 1

1

これは機能しますが、あなたgetValue()が機能していたとしても、問題は、そのグリッド列 ( IssueCondition) でカスタム タイプの値を使用し、そのためのレンダラーを指定しなかったことです。次のようなことを試してください。

Ext.define('MainGrid', {
extend: 'Ext.grid.Panel',
height: 300,
plugins: [Ext.create('Ext.grid.plugin.RowEditing', {
    clicksToEdit: 1
})],
columns: [{
    xtype: 'rownumberer'
}, {
    xtype: 'gridcolumn',
    text: 'Column Titles',
    dataIndex: 'ColumnTitle',
    editor: {
        xtype: 'textfield'
    }
}, {
    xtype: 'gridcolumn',
    sortable: false,
    text: "Issue Condition",
    align: 'center',
    dataIndex: 'IssueCondition',
    width: 200,
    editor: {
        xtype: 'reportpopulation'
    },
    renderer: function (v, attr, rec) {
        console.info(arguments);
        return 'cb: ' + rec.data.IssueCondition.cb + ' combo: ' + rec.data.IssueCondition.combo;
    }
}],
store: Ext.create("Ext.data.Store", {
    fields: ["ColumnTitle", "IssueCondition"],
    proxy: {
        type: "memory",
        reader: {
            type: "json"
        }
    }
})
});

Ext.define('SelectPopulation', {
extend: 'Ext.container.Container',
itemId: 'ctrSelectpopulation',
alias: 'widget.reportpopulation',
layout: {
    type: 'hbox'
},
initComponent: function () {
    Ext.apply(this, {
        items: [{
            xtype: "checkbox"
        }, {
            xtype: "combobox",
            allowBlank: false,
            store: [
                [0, 'Zero'],
                [1, 'One'],
                [2, 'Two']
            ]
        }]
    });
    this.callParent(arguments);
},
getValue: function () {
    return {
        cb: this.child('checkbox').getValue(),
        combo: this.child('combobox').getValue()
    };
}
});

これは単なる例であることに注意してください。

ここでフィドルを確認してください

お役に立てれば。

于 2013-01-07T12:36:30.600 に答える