Adding a Editable Blank row on top of Grid, on clcik of Add button

[prijithkr]

Hai I have a grid, which allows ADD/EDIT/DELETE records,

I used rowEdititng plugin for Editing purpose.... but how to add a Editable Blank row on top of Grid, on clcik of Add button and on click of submit, it should be added to the Store as wel... :-/




var cRGrid=Ext.create('Ext.grid.Panel', {
store: cRStore,
height: 280,
overflowY:'auto',
anchor:'100% 80%',
columns: [
{header: 'Date', dataIndex: 'date',flex:1},
{header: 'Contributions ($)', dataIndex: 'contributions',flex:1,
editor: {
xtype: 'textfield'}
},
{header: 'Redemptions ($)', dataIndex: 'redemptions',
editor: {
xtype: 'textfield'
},flex:1
},
{header: 'Total', dataIndex: 'total',flex:1}
],
plugins: [
Ext.create('Ext.grid.plugin.RowEditing', {
clicksToEdit: 1
})
]
});

[Farish]

You actually have to add the record to the store and not to the grid. When you do the following, it will shown an empty row on the top of your grid. id, name and description should be replaced by the fields you are using in your model.


addbutton.on('click', function() {
store.insert(0, {id: '', name: '', description: ''});
}); // end addbutton on click function