PDA

View Full Version : Highlighting modified cells



gordon
27 Feb 2007, 8:21 AM
Jack,

I want to change the background colour of modified cells in an editable grid. The code below appears to have the desired effect to the extent that it adds the "modified" class to the cell. However, some Ext code stomps on that class and once control returns to the browser the class has gone.

I think I had this working yesterday. However when I try to debug what's going on now I get lost in the bowels of your code.

A pointer on where the problem could be arising would be very helpful.

Am I going about this the right way? Is there a better way to achieve this effect?

Thanks,

Gordon



this.grid = new Ext.grid.EditorGrid(divId, {
ds : ds,
cm : cm,
selModel : new Ext.grid.RowSelectionModel({singleSelect:true}),
enableColLock : false,
autoSizeColumns : false,
monitorWindowResize : true,
trackMouseOver : true,
clicksToEdit : 1
});
...
this.grid.on('afteredit', this.afterEdit, this, true);
...
afterEdit : function(grid, row, field, rowIndex, columnIndex){
...
var cell = this.grid.getView().getCell(rowIndex, columnIndex);
cell = Ext.get(cell);
cell.addClass('modified');
},

jack.slocum
27 Feb 2007, 9:04 AM
In the current rev, I would recommend doing this with a renderer:


function renderDirty(val, p, record){
if(record.dirty && record.modified['some-column'] != undefined){
p.css += ' some-class';
}
return val;
}

However, I have been working on this and in the next rev this is built in. It automatically adds a class for dirty cells (x-grid-dirty-cell) and dirty rows (x-grid-dirty-row).

Note: after you save the changes, you will need to either call commit() or reject() on the individual record(s) or call commitAll()/rejectAll() on the store in order to trigger a UI update.

The new rev should be available soon.

gordon
27 Feb 2007, 9:08 AM
Fantastic. Thanks Jack

Wolfgang
27 Feb 2007, 11:34 AM
...
if(record.dirty && record.modified
...

What is the difference between "dirty" and "modified"?

jack.slocum
28 Feb 2007, 9:18 AM
Dirty tracks if anything in the record has been modified and has not been committed. The "modified" collection has the original values for the field before any edits were made (to support rollback). If modified has an entry for a field, it has been modified.

ext1974
1 Mar 2010, 8:38 PM
In the current rev, I would recommend doing this with a renderer:


function renderDirty(val, p, record){
if(record.dirty && record.modified['some-column'] != undefined){
p.css += ' some-class';
}
return val;
}

However, I have been working on this and in the next rev this is built in. It automatically adds a class for dirty cells (x-grid-dirty-cell) and dirty rows (x-grid-dirty-row).

Note: after you save the changes, you will need to either call commit() or reject() on the individual record(s) or call commitAll()/rejectAll() on the store in order to trigger a UI update.

The new rev should be available soon.

I jusr resused the above sample :

function changeText(value, metaData, record){
if(record.dirty && record.modified['Tenor4'] != undefined){
metaData.css += 'x-grid3-col-Tenor41';
}
return value;
};

notes:

1) calling the above function on grid column renderer
2) my css
.x-grid3-col-Tenor41
{
font-size:28px;
color:Red;
}

3) code is executing when I change the value in specific cell but the CSS is not applying in to the cell
4) I have checked the css name applied to cell in the firebox, it is ".x-grid3-col-Tenor4". ( since I given the Id for the column Tenor4)

Can you help me out regarding this?

I have tried below option too but it did not help

metaData.attr="some style" [ got this stuff from grid_faq section.

not sure where I am missing the code