PDA

View Full Version : how can I see my record after my grid reloaded ???



sense.nda12
24 Sep 2010, 12:32 AM
Hi,

Is is possible to add a feature to the GridPanel that allow the scrolling to back where it was after a loading of data ?:-/:-/

Example, you have a grid with a lot of column (say for instance something like 15-20).
you scroll to the middle of the grid..and you decide to refresh the store, the scroll goes back the left and you have to scroll again to see the data...

what can i do to my grid????:-?:-?:-?
is any plugin or some function to back to my record after reload???

this my code :


var gridCustomer = {
xtype: 'grid',
id: 'card-0',
onHeader: '',
listeners:{
headerclick : function(g,columnIndex,eve){
var sR = g.colModel.getColumnAt(columnIndex).dataIndex;
g.onHeader = sR;
},
rowdblclick: function(g, index, ev){
winCust.show();
winCust.hide();
var rec = g.getSelectionModel().getSelected();
Ext.getCmp("formCustomer").getForm().loadRecord(rec);
winCust.myaction='edit';
winCust.seldata = rec.data.CUSTID;
winCust.show();
}
},
frame: true,
title: 'Customer',
height:535,
width:1317,
store: storeCust,
plugins: new Ext.ux.grid.Search({
id:'search',
iconCls:'icon-zoom',
minChars:2,
checkIndexes:[],
autoFocus:true,
mode: 'header',
position:top,
align : 'right'
}),
columns:[
//{header: "Cust ID", dataIndex: 'CUSTID', sortable: true},
{header: "Cust Name", id:'CUSTNAME',dataIndex: 'CUSTNAME', sortable: true},
{header: "Third Party Name", id:'THIRDPARTYNAME',dataIndex: 'THIRDPARTYNAME', sortable: true},
{header: "NPWP", id:'NPWP',dataIndex: 'NPWP',sortable:true},
{header: "Industry", id:'INDUSTRY',dataIndex: 'INDUSTRY',sortable:true},
{header: "Address", id:'ADDRESS',dataIndex: 'ADDRESS',sortable:true},
{header: "Telp", id:'TELP',dataIndex: 'TELP',sortable:true},
{header: "Fax", id:'FAX',dataIndex: 'FAX',sortable:true},
{header: "Email", id:'EMAIL',dataIndex: 'EMAIL', sortable: true},
{header: "EF in No", id:'EFINNO',dataIndex: 'EFINNO',sortable:true},
{header: "EF in Exp Date", id:'EFINEXPDATE',dataIndex: 'EFINEXPDATE', sortable:true},
{header: "Bundling Contract", id:'BUNDLINGCONTRACT',dataIndex: 'BUNDLINGCONTRACT',sortable:true}
],
sm: new Ext.grid.RowSelectionModel({
singleSelect: true
}),
bbar:{
xtype: 'paging',
pageSize: 20,
store: storeCust,
displayInfo: true,
prependButtons: true,
displayMsg: 'Displaying data {0} - {1} of {2}',
emptyMsg: "No topics to display",
params:{
action: 'paging'
}
},
tbar:[{
text: 'Add',
icon: 'extjs/resources/images/yourtheme/dd/drop-add.gif',
cls: 'x-btn-text-icon',
handler: function(){
Ext.getCmp("formCustomer").getForm().reset();
Ext.getCmp("formCustomer").getForm().clear;
winCust.myaction= 'insert';
winCust.show();
}
},{
text: 'Edit',
icon: 'extjs/resources/images/yourtheme/dd/drop-yes.gif',
cls: 'x-btn-text-icon',
handler: function() {
winCust.show();
winCust.hide();
var sm = Ext.getCmp("card-0").getSelectionModel();
var sel = sm.getSelected();
if (sm.hasSelection()){
Ext.getCmp('formCustomer').getForm().loadRecord(sel);
winCust.myaction= 'edit';
winCust.seldata= sel.data.CUSTID;
winCust.show();
}else{
Ext.Msg.alert('Error', 'Please select a row before clicking on edit.');
}
}
},{
text: 'Remove',
icon: 'extjs/resources/images/yourtheme/dd/drop-no.gif',
cls: 'x-btn-text-icon',
handler: function() {
var sm = Ext.getCmp("card-0").getSelectionModel();
var sel = sm.getSelected();
if (sm.hasSelection()){
Ext.Msg.show({
title: 'Remove Data',
buttons: Ext.MessageBox.YESNOCANCEL,
msg: 'Remove '+sel.data.CUSTNAME+'?',
fn: function(btn){
if (btn=='yes'){
var conn = new Ext.data.Connection();
conn.request({
url: 'json/customer/customerConnection.php',
params:{
action: 'delete',
id: sel.data.CUSTID
},
success: function(response, opts){
//Ext.getCmp("gridSalesDir").getStore().remove(sel);
storeCust.reload();
var obj = Ext.decode(response.responseText);
Ext.Msg.alert('info',obj.sukses);
},
failure: function(resp,opt){
Ext.Msg.alert('Error','Unable to delete data');
}
});
}
}
});
}else{
Ext.Msg.alert('Error', 'Please select a row before clicking on remove.');
}
}
}]
};