ExtJS 04_grid Click event New Discovery _javascript Tips

EXTJS grid Click Rows and cells to get the contents of a row or cell (data)
JS Code

Copy Code code as follows:

Grid.addlistener (' Cellclick ', Cellclick);
function Cellclick (grid, RowIndex, ColumnIndex, e) {
var record = Grid.getstore (). GetAt (RowIndex); Get the Record
var fieldName = Grid.getcolumnmodel (). Getdataindex (ColumnIndex); Get field Name
var data = Record.get (FieldName);
Ext.MessageBox.alert (' Show ', ' currently selected data is ' +data ');
}
Grid.addlistener (' Cellclick ', Cellclick);
function Cellclick (grid, RowIndex, ColumnIndex, e) {
var record = Grid.getstore (). GetAt (RowIndex); Get the Record
var fieldName = Grid.getcolumnmodel (). Getdataindex (ColumnIndex); Get field Name
var data = Record.get (FieldName);
Ext.MessageBox.alert (' Show ', ' currently selected data is ' +data ');
}

------------------------------------------------------------------------------
JS Code

Copy Code code as follows:

Grid.on (' MouseOver ', function (e) {//Add MouseOver Event
var index = Grid.getview (). Findrowindex (E.gettarget ())//The location of the column according to the target mouse
if (index!==false) {//When the correct column is fetched (False if the incoming target column is not fetched)
var record = Store.getat (index);//Take the record out of this column
var str = ext.encode (record.data);//Assemble a string, this needs to be done by yourself, and here I serialize him.
var rowel = Ext.get (E.gettarget ());//Convert Target to Ext.element object
Rowel.set ({
' Ext:qtip ': str//Set its Tip property
},false);
}
});
Grid.on (' MouseOver ', function (e) {//Add MouseOver Event
var index = Grid.getview (). Findrowindex (E.gettarget ())//The location of the column according to the target mouse
if (index!==false) {//When the correct column is fetched (False if the incoming target column is not fetched)
var record = Store.getat (index);//Take the record out of this column
var str = ext.encode (record.data);//Assemble a string, this needs to be done by yourself, and here I serialize him.
var rowel = Ext.get (E.gettarget ());//Convert Target to Ext.element object
Rowel.set ({
' Ext:qtip ': str//Set its Tip property
},false);
}
});

---------------------------------------------------------------------------------
JS Code

Copy Code code as follows:

Listeners: {
' Cellclick ': function (grid,rowindex,columnindex,e) {}
}
This is the event that is triggered when the grid cell is clicked
Listeners: {
' Cellclick ': function (grid,rowindex,columnindex,e) {}
}
This is the event that is triggered when the grid cell is clicked
JS Code
Grid.getview (). Getcell (Rowindex,columnindex). style.background-color= "#FF6600";
Grid.getview (). Getcell (Rowindex,columnindex). style.color= "#FF6600";
Grid.getview (). Getcell (Rowindex,columnindex). style.background-color= "#FF6600";
Grid.getview (). Getcell (Rowindex,columnindex). style.color= "#FF6600";

I want to change all the background color, not just the color of the word. How can I point a cell, let the last point of the cell color back to the original???
Refresh the table to restore the previously clicked Color, Grid.getview (). Refresh (); Then let the clicked cell change color.
JS Code

Copy Code code as follows:

Grid.getview (). Refresh ();
Grid.getview (). Getcell (Rowindex,columnindex). style.backgroundcolor= "#FF9999";