PDA

View Full Version : how to highlight a grid row after this row edited?



Mr.Solomon
14 Aug 2013, 12:48 AM
Hi,all
I used a plugin named RowEditor In a gird ,I met a strange problem ,When I only edit one row ,it works well,but If I go on to edit another rows after submit, all of the rows that had edited were highlighting,but I hope only hightlight one row that edited just now not all,and this is my code below this


saveText: '??',
listeners:{ 'afteredit':function(roweditor,changes,record,index){ var s =Ext.getCmp(config.grid).getSelectionModel().getSelections(); var Params = Object.keys(s[0].json); var tempArr = {}; for(var i in Params){ if(Params.hasOwnProperty(i)){ tempArr[Params[i]]=s[0].get(Params[i]); } } //params = JSON.stringify(tempArr); var params = Ext.encode(tempArr); Ext.Ajax.request({ url:config.url, scope:this, method:'POST', //params:params, params:tempArr, success:function(response){ var obj = Ext.decode(response.responseText); if(obj.success){ Ext.MessageBox.alert("??","????"); var ds = Ext.getCmp(config.grid).getStore(); /*var g = Ext.getCmp(config.grid); var row = g.getView().getRow(0); Ext.fly(row).highlight("red", { attr: "background-color", easing: 'easeOut', duration: .5 }); function load(){ var ds = Ext.getCmp(config.grid).getStore(); var g = Ext.getCmp(config.grid); var row = g.getView().getRow(index); Ext.get(row).highlight('#FFFF00',{ attr: "background-color", easing: 'easeOut', duration: 15 }); }; ds.on('load',load);*/ ds.load();

Mr.Solomon
14 Aug 2013, 1:00 AM
saveText: '??',
listeners:{
'afteredit':function(roweditor,changes,record,index){
var s =Ext.getCmp(config.grid).getSelectionModel().getSelections();
var Params = Object.keys(s[0].json);
var tempArr = {};
for(var i in Params){
if(Params.hasOwnProperty(i)){
tempArr[Params[i]]=s[0].get(Params[i]);
}
}
//params = JSON.stringify(tempArr);
var params = Ext.encode(tempArr);
Ext.Ajax.request({
url:config.url,
scope:this,
method:'POST',
//params:params,
params:tempArr,
success:function(response){
var obj = Ext.decode(response.responseText);
if(obj.success){
Ext.MessageBox.alert("??","????");
var ds = Ext.getCmp(config.grid).getStore();
/*var g = Ext.getCmp(config.grid);
var row = g.getView().getRow(0);
Ext.fly(row).highlight("red", {
attr: "background-color",
easing: 'easeOut',
duration: .5
});
function load(){
var ds = Ext.getCmp(config.grid).getStore();
var g = Ext.getCmp(config.grid);
var row = g.getView().getRow(index);
Ext.get(row).highlight('#FFFF00',{
attr: "background-color",
easing: 'easeOut',
duration: 15
});
};
ds.on('load',load);*/
ds.load();

slemmon
15 Aug 2013, 4:15 PM
To clarify, what you're wanting to do is allow users to edit multiple rows in a grid and then submit those changes up to your server and once the success response comes back you want to highlight the rows of the grid that had edits applied to them is that correct?

Mr.Solomon
16 Aug 2013, 1:58 AM
Thank you for your reply!
Yes,you are almost right,but I want to highlight the last modified row,not all of them , for instance I have a grid with 100 rows ,if I edit the first row named NO.1, and I submit to server successfully,after the gridview refreshed ,NO.1 was highlight,and it will fade out in 15 seconds,if I am going on to edit the second row which is NO.2 ,and I submit to server successfully too,after gridview refreshed I just want the NO.2 to highlight,not both N0.1 and NO.2,the problem what I met was after I edited the second row,both of them were highlight ,are you clear ? sorry for my poor English , I hope you can understand my promblem ,thanks very much

slemmon
16 Aug 2013, 7:13 AM
You can either record the last edited record locally in your client code so that it is recalled for highlighting or you can pass back in the success response from the server the record that was last edited. I think if it were me I'd do that second option. I'd pass back in the success response the ID of the record edited. That way on load I'd look to see did an ID get passed back? If so, find (http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.data.Store-method-find) the record with that ID in the store (which gives you the index) and highlight it.

Mr.Solomon
18 Aug 2013, 5:58 PM
You can either record the last edited record locally in your client code so that it is recalled for highlighting or you can pass back in the success response from the server the record that was last edited. I think if it were me I'd do that second option. I'd pass back in the success response the ID of the record edited. That way on load I'd look to see did an ID get passed back? If so, find (http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.data.Store-method-find) the record with that ID in the store (which gives you the index) and highlight it.

slemmon ,Thanks again,In fact,I did as you said before I post this question,I will try again :)