Live apply width to a column by external command

[Jonathan]

Hi,

With allowResizing : I give user the possibility to resize column.

With instance.getPersistData I can see the final size of each column, So I can save it if I want.

How to apply to column 'x' a width 'y' that I previously local saved.

I speak about live width live whange from external command to apply only width changed by the user (locally saved).

Thanks,

Jonathan

[Rajapandi Ravi]

Hi Jonathan, 

Greetings from syncfusion support 

Based on your query we suspect that you like to save the state of the resize columns and restore the saved state whenever you want. So, we have prepared a sample and we suggest you use the below way to achieve your requirement. 

You can achieve it by storing the Grid’s initial settings(which can be retrieved using the getPersistData method of the Grid) in the save button click event and then when needed pass this persisted data to the Grid’s setProperties method in order to restore it. This is demonstrated in the below code snippet, 

// button click function for restoring Grid’s settings 

restoreBtnClick: function () { 

// The saved state settings is restored to the Grid 

      this.$refs.grid.ej2Instances.setProperties(this.savedProperties); 

    }, 

    savestateBtnClick: function () { 

// Persist data are stored in global variable  

      this.savedProperties = Object.assign( [], JSON.parse(this.$refs.grid.ej2Instances.getPersistData()) 

      ); 

    }, 

Sample: https://codesandbox.io/s/vue-forked-itir9?file=/src/App.vue 

Screenshot: 

Grid column’s width at initial rendering 

 

Grid column’s width while saving the state 

 

Grid column’s width after restoring the state 

 

Regards,
Rajapandi R