igGrid: how to replace datasource ?

Hello all,

I'm having troubles with igGrid and datasource option.

I already read this topic and it helps me to find a solution which, unfortunatelly, doesn't work at all.

This is my scenario:

The user had to press a button to add a row to a igGrid. Immediatly after the row is added, the saveChanges is called. If server logics are Ok, a Json result which contains my datasource is returned. In this case I want to bind the igGrid datasource to the returned result.

If I just write $("#grid1").igGrid('option', 'dataSource', data);  data is appended to old data. I want to replace old data with new one.

Those are relevant code lines:

$('#grid1').igGrid(
{
virtualization: false,
//dataSourceUrl: '/Richiesta/getRichiesta',
updateUrl: '/Richiesta/updRichiesta',
autoGenerateColumns: false,
renderCheckboxes: true,
autoGenerateLayouts: false,
mergeUnboundColumns: false,
responseDataKey: 'Records',
generateCompactJSONResponse: false,
enableUTCDates: true,
autoCommit: false,
columns:
 [
 //{ key: 'num_rif_richiesta', dataType: 'number', headerText: 'rif', width: '4em' },
 //{ key: 'num_riga', dataType: 'number', headerText: 'riga', width: '4em' },
 { key: 'cod_tipo_articolo', dataType: 'string', headerText: 'Marchio', width: '4em' },
 { key: 'cod_articolo', dataType: 'string', headerText: 'Codice', width: '6em' },
 { key: 'chkurgente', dataType: 'bool', headerText: 'Urg', width: '3em' },
 { key: 'des_riga', dataType: 'string', headerText: 'Descrizione', width: '10em' },
 { key: 'num_qta', dataType: 'number', headerText: 'Qta', width: '2em', formatter: formatNumero },
 { key: 'numdisponibilita', dataType: 'number', headerText: 'Disp', width: '2em', formatter: formatNumero },
 { key: 'val_prezzo_unitario', dataType: 'number', headerText: 'Prezzo', width: '6em', formatter: formatValuta },
 { key: 'prc_sconto', dataType: 'number', headerText: 'Sconto', width: '4em', formatter: formatPercentuale },
 { key: 'prc_sconto_add', dataType: 'number', headerText: 'Sc Add', width: '4em', formatter: formatPercentuale },
 { key: 'val_importo', dataType: 'number', headerText: 'Netto', width: '6em', formatter: formatValuta },
 { key: 'mat_telaio', dataType: 'string', headerText: 'Telaio', width: '8em' },
 { key: 'des_modello', dataType: 'string', headerText: 'Modello', width: '10em'},
 { key: 'des_note', dataType: 'string', headerText: 'Note', width: 'auto'}
 ],
dataBound: function(evt, ui) {
$("#grid1").data("igGrid").dataSource._addChangesSuccessHandler(function (data, textStatus, jqXHR) {
gridReBind(data);
pulisciRiga();
});
},
features: [
{
name: "Selection",
mode: "row",
multipleSelection: false,
rowSelectionChanging: function (ui, args) { },
rowSelectionChanged: function (ui, args) {
selezionaRiga(args.row.index);

}
},
{
name: "Updating",
enableAddRow: false,
editMode: "none",
enableDeleteRow: false,
showDoneCancelButtons: false
}

],
width: '100%',
localSchemaTransform: false
});

function gridReBind(data) {
$("#grid1").igGrid("rollback");
//$("#grid1").igGrid("dataSourceObject", data);
$("#grid1").igGrid('option', 'dataSource', data);
//$("#grid1").igGrid("dataBind");
}

Thanks in advance

Hello Fabio.

Thank you for using our igGrid.

I read carefully your scenario and the only issue that I see is that you are setting the option dataSource

http://help.infragistics.com/jQuery/2013.2/ui.iggrid#options

 instead calling the method dataSourceObject

http://help.infragistics.com/jQuery/2013.2/ui.iggrid#methods

I mean your code snippet should look like this

$("#grid1").igGrid("dataSourceObject", data);

where data is pointing to the local JSON array of data that is get from the addChangesSuccessHandler.

Let me know if this helps.

Hello Tsvetelina,

thank you for your help. I finally found a navigation bug which exclude ifragistics bug.

Sorry for wasting time!

I forgot to write gridReBind function is still working this way (I changed grid to hierarchicalgrid)

function gridReBind(data) {

$("#grid1").igHierarchicalGrid("rollback");

$("#grid1").igHierarchicalGrid('option', 'dataSource', data);
$("#grid1").igHierarchicalGrid("dataBind");
};