How to change data source?

[Arif Nurdiansyah]

Hello, i try to change the data source and refresh it, how to do that?

I try to using grid.dataSource(newdatasource) but it's not working

Thanks You

[Hariharan J V]

Hi Arif,  

  

Thanks for contacting Syncfusion support. 

 

We suggest you set  the data source like below code snippets. 

 

gridObj.dataSource = newDataSource. 

 

Please get back to us if you need further assistance.  

  

Regards,  

Hariharan  

[Arif Nurdiansyah]

Hello, how to change the data source if the column have foreign key?

This is my grid code

    var grid = new ej.grids.Grid({

        dataSource: data,

        editSettings: {

            allowEditing: true,

            allowAdding: false,

            allowDeleting: false,

            mode: 'Dialog',

            showConfirmDialog: true,

            showDeleteConfirmDialog: true

        },

        allowPaging: true,

        toolbarTemplate: '#toolbar-template',

        height: 500,

        queryCellInfo: queryCellInfo,

        columns: [

            { type: 'checkbox', field: 'CheckBox', width: 100 },

            { field: 'id', isPrimaryKey: true, visible: false, headerText: 'id', textAlign: 'Right', width: 10, type: 'number' },

            { field: 'officePerusahaanId', visible: false, headerText: 'officePerusahaanId', textAlign: 'Right', width: 10, type: 'number' },

            { field: 'pegawaiId', visible: false, headerText: 'pegawaiId', textAlign: 'Right', width: 10, type: 'number' },

            { field: 'tanggalPengajuan', width: 200, headerText: 'Tanggal Pengajuan', type: 'string', editType: 'datepickeredit',format: { skeleton: 'yMMMEd', type: 'date' }, validationRules: { required: true } },

            { field: 'nik', width: 240, headerText: 'NIK', type: 'string', validationRules: { required: true } },

            { field: 'deskripsi', width: 240, headerText: 'Deskripsi', type: 'string', validationRules: { required: true } },

            { field: 'kategori', width: 140, headerText: 'Kategori', type: 'string', validationRules: { required: true } },

            { field: 'isBiasa', width: 140, headerText: 'IsBiasa', type: 'string', template: '#biasa', validationRules: { required: true } },

            { field: 'isMendesak', width: 140, headerText: 'IsMendesak', type: 'string', template: '#mendesak', validationRules: { required: true } },

            {

                field: 'itHelpdeskStatus', width: 140, headerText: 'ITHelpdeskStatus', type: 'string', validationRules: { required: true },

                foreignKeyField: 'itHelpdeskStatus', foreignKeyValue: 'value', editType: 'dropdownedit', dataSource: [

                    { itHelpdeskStatus: 1, value: 'Submitted' },

                    { itHelpdeskStatus: 2, value: 'Sedang Dikerjakan' },

                    { itHelpdeskStatus: 3, value: 'Selesai' }

                ],

            },

            { field: 'recheckOK', width: 140, headerText: 'ReCheck OK', type: 'string', validationRules: { required: true } },

        ],

        pageSettings: { pageCount: 2, pageSizes: true },

    });

every time i change the data source it's like the grid.refresh() only

[Madhu Sudhanan P]

Hi Arif, 

While using foreign key columns, setting new data source using dataSource property will refresh the view with new data properly. For your reference we have created the below sample, please find the sample. 

https://stackblitz.com/edit/nyssvq?file=index.js 

In the sample, click the Change data button to change the data source. 

If you still faced the problem please get back to us with the below details that help us to analyze further. 

1.       Screenshot of developer tool after data change to check script error. 

2.       Register actionFailure event to check any possible failure durint data change.  

https://ej2.syncfusion.com/javascript/documentation/grid/data-binding.html#handling-http-error 

3.       Please provide us with video or sample to replicate the problem. 

4.       Please share us the grid version you are using 

Regards, 

Madhu Sudhanan P