当我删除row
时 - 它再次出现在客户端 - 刷新页面我发现它确实已被删除
在方法中添加store.reload
意味着它会再次出现,然后在重新加载store
时消失。
任何帮助表示赞赏
// The DataWriter component.
var writer = new Ext.data.JsonWriter({
encode: false
})
Ext.namespace('codeblender');
codeblender.app = function() {
/**
* Render the ground links
*
* @param val
* @param p
* @param record
* @return
*/
function rendererGroundLink(val, p, record) {
var string = record.data.ground;
var newContent = string.replace(/ /g, '-');
return ('<a href="venues/' + newContent.toLowerCase() + '/" target="_new">' + record.data.ground + '</a>');
}
// Public space
return {
// Public methods
init: function() {
// !Create the data store
var store = new Ext.data.JsonStore({
fields: [{
name: 'id',
type: 'int'
}, {
name: 'division_id',
type: 'int'
}, {
name: 'competition',
type: 'string'
}, {
name: 'date',
type: 'date',
dateFormat: 'Y-m-d'
}, {
name: 'time',
type: 'time'
}, {
name: 'referee',
type: 'string'
}, {
name: 'ground',
type: 'string'
}, {
name: 'team_a',
type: 'string'
}, {
name: 'score_a',
type: 'string'
}, {
name: 'scorer_a',
type: 'string'
}, {
name: 'team_b',
type: 'string'
}, {
name: 'score_b',
type: 'string'
}, {
name: 'scorer_b',
type: 'string'
}],
idProperty: 'id',
messageProperty: 'message',
pruneModifiedRecords: true,
remoteSort: true,
restful: true,
root: 'data',
sortInfo: {
field: 'date',
direction: "DESC"
},
successProperty: 'success',
totalProperty: 'totalCount',
url: '/restfixture',
writer: writer
});
store.load({
params: {
start: 0,
limit: 50,
sort: 'date',
dir: 'DESC'
}
});
// !Create the Team data store
var storeTeam = new Ext.data.JsonStore({
baseParams: {
status: 'Active'
},
fields: [{
name: 'id',
type: 'int'
}, {
name: 'team',
type: 'string'
}],
restful: true,
root: 'data',
sortInfo: {
field: 'team',
direction: "ASC"
},
url: '/restteam'
});
// !Create the Ground data store
var storeGround = new Ext.data.JsonStore({
fields: [{
name: 'id',
type: 'int'
}, {
name: 'ground',
type: 'string'
}],
restful: true,
root: 'data',
url: '/restground'
});
// !Create the Referee data store
var storeReferee = new Ext.data.JsonStore({
fields: [{
name: 'id',
type: 'int'
}, {
name: 'referee',
type: 'string'
}],
restful: true,
root: 'data',
url: '/restreferee'
});
// !Create the column model
var columns = [{
header: 'Division',
sortable: true,
dataIndex: 'division_id',
width: 75,
editor: {
allowBlank: false,
editable: false,
lazyRender: true,
mode: 'local',
store: [
[1, 'Division 1'],
[2, 'Division 2'],
[3, 'Division 3']
],
triggerAction: 'all',
xtype: 'combo'
}
}, {
header: 'Competition',
sortable: true,
dataIndex: 'competition',
editor: {
allowBlank: false,
editable: false,
lazyRender: true,
mode: 'local',
store: ['Season 8', 'Cup 8', 'Season 7', 'Cup 7', 'Season 6', 'Cup 6', 'Season 5', 'Cup 5', 'Season 4', 'Cup 4', 'Season 3', 'Cup 3', 'Season 2', 'Cup 2', 'Season 1', 'Cup 1'],
triggerAction: 'all',
xtype: 'combo'
}
}, {
header: 'Date',
sortable: true,
dataIndex: 'date',
xtype: 'datecolumn',
format: 'Y-m-d',
width: 100,
editor: {
allowBlank: false,
editable: true,
emptyText: 'Date',
format: 'Y-m-d',
xtype: 'datefield'
}
}, {
header: 'Time',
sortable: false,
dataIndex: 'time',
editor: {
allowBlank: false,
editable: false,
format: 'H:i:s',
increment: 5,
minValue: '09:00:00',
xtype: 'timefield'
}
}, {
header: 'Referee',
sortable: true,
dataIndex: 'referee',
editor: {
allowBlank: false,
displayField: 'referee',
editable: false,
emptyText: 'Select Referee',
forceSelection: true,
lazyRender: true,
mode: 'remote',
store: storeReferee,
triggerAction: 'all',
valueField: 'id',
xtype: 'combo'
}
}, {
header: 'Ground',
sortable: true,
dataIndex: 'ground',
renderer: rendererGroundLink,
editor: {
allowBlank: false,
displayField: 'ground',
editable: false,
emptyText: 'Select Ground',
forceSelection: true,
lazyRender: true,
mode: 'remote',
store: storeGround,
triggerAction: 'all',
valueField: 'id',
xtype: 'combo'
}
}, {
header: 'Team A',
sortable: true,
dataIndex: 'team_a',
editor: {
allowBlank: false,
displayField: 'team',
editable: false,
emptyText: 'Select Team A',
forceSelection: true,
lazyRender: true,
mode: 'remote',
name: 'team',
store: storeTeam,
triggerAction: 'all',
valueField: 'id',
xtype: 'combo'
}
}, {
header: 'Score A',
sortable: true,
dataIndex: 'score_a',
editor: {
xtype: 'spinnerfield'
}
}, {
header: 'Scorer A',
sortable: false,
dataIndex: 'scorer_a',
editor: {
xtype: 'textarea'
}
}, {
header: 'Team B',
sortable: true,
dataIndex: 'team_b',
editor: {
allowBlank: false,
displayField: 'team',
editable: false,
emptyText: 'Select Team B',
forceSelection: true,
lazyRender: true,
mode: 'remote',
name: 'team',
store: storeTeam,
triggerAction: 'all',
valueField: 'id',
xtype: 'combo'
}
}, {
header: 'Score B',
sortable: true,
dataIndex: 'score_b',
editor: {
xtype: 'spinnerfield'
}
}, {
header: 'Scorer B',
sortable: false,
dataIndex: 'scorer_b',
editor: {
xtype: 'textarea'
}
}
];
// Create the pager
var pagingBar = new Ext.PagingToolbar({
displayInfo: true,
displayMsg: '{0} - {1} of {2}',
emptyMsg: 'No Data',
pageSize: 50,
store: store
});
// Create the Grid
var grid = new xg.GridPanel({
bbar: pagingBar,
columns: columns,
height: 500,
iconCls: 'icon-grid',
loadMask: {
msg: 'Loading data.',
enabled: true
},
plugins: [rowEditor],
renderTo: 'dbGrid',
sm: new Ext.grid.RowSelectionModel({
singleSelect: true
}),
store: store,
stripeRows: true,
tbar: [{
text: 'Add',
iconCls: 'icon-add',
handler: function() {
var record = new store.recordType({
division_id: 1,
date: (new Date()).clearTime(),
time: '10:00:00',
referee: '',
ground: '',
team_a: '',
score_a: '',
team_b: '',
score_b: ''
});
grid.suspendEvents();
rowEditor.stopEditing();
grid.store.insert(0, record);
grid.getView().refresh();
grid.getSelectionModel().selectRow(0);
rowEditor.startEditing(0);
grid.resumeEvents();
}
}, {
iconCls: 'icon-del',
text: 'Remove Fixture',
handler: function() {
rowEditor.stopEditing();
grid.suspendEvents();
var record = grid.getSelectionModel().getSelected();
if (record) {
store.remove(record);
}
store.reload({}, true);
grid.resumeEvents();
}
}],
title: 'Fixtures',
viewConfig: {
forceFit: true
}
});
}
};
}();
答案 0 :(得分:1)
尝试:
grid.getView().refresh()
而不是:
store.reload({}, true);