Вопрос

I have an editable grid panel with a column and I would like to change each individual value in the column to the same value when I press the applyToAll button. There doesn't seem to be any api call that enables me to get all of the values in the column or even all the values in the grid panel.

//Model that defines my column named fileName
var colModel = new Ext.grid.ColumnModel([{
    header:'File Name', 
    dataIndex:'fileName'
    }
]);

// Editable grid panel:
var myGrid = new Ext.grid.EditorGridPanel({          
    store: store,
    colModel: colModel,
    clicksToEdit: 1,
    autoWidth: true,
    autoHeight: true
});

// Button that changes all the column names
var applyToAll = new Ext.Button({
  text: "Apply to All",
  handler: function(){
    var record = myGrid.getSelectionModel().getSelected();

    //Change the values of the column here somehow.

  }
});

//Form which holds everything
var gridForm = new Ext.FormPanel({
  id: 'mainForm',
  frame: true,
  items: [{
    columnWidth: 0.6,
    layout: 'fit',
    items: [myGrid],
    buttons: [applyToAll]
 });

How can I change all the values in the column when I click the applyToAll button?

Это было полезно?

Решение

To know which cell is selected, please use the CellSelection model

var myGrid = new Ext.grid.EditorGridPanel({          
    // ...
    selModel: new Ext.grid.CellSelectionModel(),
    // ...
});

Then you can call each record of the store and change the needed value:

// Button that changes all the column names
var applyToAll = new Ext.Button({
    text: "Apply to All",
    handler: function(){
        var record = myGrid.getSelectionModel().getSelected();
        var row = myGrid.getSelectionModel().getSelectedCell()[0];
        var col = myGrid.getSelectionModel().getSelectedCell()[1];
        var column_name = myGrid.getColumnModel().getColumnAt(col).dataIndex;


        myGrid.getStore().each(function(rec){
            rec.set(column_name, myGrid.getStore().getAt(row).get(column_name));
        });
    }
});

Другие советы

What I ended up doing:

var myGrid = new Ext.grid.EditorGridPanel({
  //...
  //I needed RowSelectionModel for another portion of my code
  selModel: new Ext.grid.RowSelectionModel()
  //...
)};

var applyToAll = new Ext.Button({
  text: "Apply to All",
  handler: function(){
    var record = myGrid.getSelectionModel().getSelected();
    myGrid.stopEditing();

    var gridStore = myGrid.getStore();
    var records = gridStore.getRange(0, gridStore.getTotalCount());

    for(var ii=0; ii<records.length; ii++){
      var curRecord = records[ii];
      curRecord.set('testCell', record.get('testCell'));
    }

    gridStore.removeAll(true);
    gridStore.add(records);

    myGrid.startEditing(0, 0);
  }
});
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top