3

Ext.grid.Panelを別の で定義する方法を見つけようとしていますselType。

実際には、単一のセルと行の両方を選択できるグリッドが必要です (チェックボックス付き)。selType最初のケースではconfig を として定義する必要がありますcellmodelが、2 番目のケースではselTypeとして構成する必要がありますcheckboxmodel。残念ながら、selType配列ではなく文字列を受け入れます。

selTypeでは、単一のグリッドで異なるものを定義する方法はありますか?

4

2 に答える 2

3

OK、同じグリッドでaselTypeと a の両方を構成できます。selModel

次に例を示します。

// Store
var store = Ext.create ('Ext.data.Store', {
  fields: ['name', 'surname'] ,
  data: [
    {name: 'foo', surname: 'bar'} ,
    {name: 'too', surname: 'tar'} ,
    {name: 'zoo', surname: 'zar'} ,
    {name: 'coo', surname: 'car'} ,
    {name: 'boo', surname: 'bar'}
  ]
});

そしてグリッド：

// Dual selection grid
Ext.create ('Ext.grid.Panel', {
  title: 'My Grid' ,
  store: store ,
  width: 300 ,
  height: 300 ,
  renderTo: Ext.getBody () ,

  selModel: Ext.create ('Ext.selection.CheckboxModel') ,
  selType: 'cellmodel' ,
  plugins: {
    ptype: 'cellediting' ,
    clicksToEdit: 1
  } ,

  columns: [{
    text: 'Name' ,
    dataIndex: 'name' ,
    editor: {
      xtype: 'textfield' ,
      allowBlank: false
    }
  } , {
    text: 'Surname' ,
    dataIndex: 'surname' ,
    editor: {
      xtype: 'textfield'
    }
  }]
});

しかし、A1rPunselTypeによって提案された方法に従うことも可能で、階層でより適切に使用できます。

// Base grid with cellediting plugin and cellmodel as selType
Ext.define ('CellEditGrid', {
  extend: 'Ext.grid.Panel' ,
  selType: 'cellmodel' ,
  plugins: {
    ptype: 'cellediting'
    clicksToEdit: 1
  }
});

// Adds the checkboxmodel selType to the base CellEditGrid
Ext.define ('DualSelectionGrid', {
  extend: 'CellEditGrid' ,
  selType: 'checkboxmodel' ,
  multiSelect: true
});

// Finally, we got our dual selection grid (cellmodel and checkboxmodel)
Ext.create ('DualSelectionGrid', {
  title: 'My Grid' ,
  store: store ,
  width: 300 ,
  height: 300 ,
  renderTo: Ext.getBody () ,

  columns: [{
    text: 'Name' ,
    dataIndex: 'name' ,
    editor: {
      xtype: 'textfield' ,
      allowBlank: false
    }
  } , {
    text: 'Surname' ,
    dataIndex: 'surname' ,
    editor: {
      xtype: 'textfield'
    }
  }]
});
于 2012-10-07T12:23:20.090 に答える