Change DataSource but keep the columns

Question

Hi,I have a grid with all columns initalize properly on View, and have a button to change DataSource during runtime.How do I keep the same columns when I update the datasource?Snippetconst gridObj = document.getElementById("grid").ej2_instances[0];
var newDataSource = new ej.data.DataManager({    url: newUrl,
    adaptor: new ej.data.UrlAdaptor()
 });
 gridObj.changeDataSource(newDataSource);
﻿﻿

Santhosh Iruthayaraj · Accepted Answer

Hi Skye,

Greetings from Syncfusion support.To preserve the configured columns after changing the
dataSource using the changeDataSource method, you can simply store the
columns in a variable using the getColumns method of the Grid before
changing the dataSource. Then, pass the stored columns as a second parameter to
the changeDataSource method. Please refer to the code snippet below:

[CSHTML]
   
  const gridObj = document.getElementById("grid").ej2_instances[0];
   
  var newDataSource = new ej.data.DataManager({
    url: newUrl,
    adaptor: new ej.data.UrlAdaptor(),
  });
   
  // storing the column configuration before changing the
  dataSource
  var savedColumns = gridObj.getColumns();
   
  // passing the stored columns to changeDataSource method’s
  second parameter
  gridObj.changeDataSource(newDataSource, savedColumns);

API references:
 getColumns method: https://ej2.syncfusion.com/javascript/documentation/api/grid/#getcolumns
 changeDataSource method: https://ej2.syncfusion.com/javascript/documentation/api/grid/#changedatasource
Please let us know if you have any further queries.Regards,Santhosh I

Skye · Answer

Hi Santhosh I,Thanks for the answer, appreciate it. Regards, Skye

Santhosh Iruthayaraj · Answer

Hi Skye, We are glad that the provided solution helped to solve the issue. Please get back to us for further assistance when needed. We are marking this ticket as solved.Regards,Santhosh I