[Vuejs]-Vue "hook" external object rendered AFTER mount event

0👍

We suggest you to use the following codes which will allow you to modify the existing columns in Grid or add a new column to the Grid, after the Grid has been rendered.

 <ejs-grid id="Grid">
    ...
 </ejs-grid>

To change the width of a column in Grid, follow the below codes:

 //Allows you to get the Grid element. Here “Grid” is the ID of Grid element.
 var grid = document.getElementById("Grid")

 //Creates a instance for the Grid
 var gridinstance = grid.ej2_instances[0]

 //Changes the width of the column in 2nd index
 gridinstance.columns[2].width = 400;

 //To refresh the columns in Grid to view the changes call the below function
 gridinstance.refreshColumns();

To add a new column in Grid, follow the below codes:

//Allows you to get the Grid element. Here “Grid” is the ID of Grid element.
var grid = document.getElementById("Grid")

//Creates a instance for the Grid
var gridinstance = grid.ej2_instances[0]

//Adds a new column in in the Grid
gridinstance.columns.push({ field: "ShipCity" })

//To make the added new column display in Grid call the below function
gridinstance.refreshColumns();

If we have misunderstood your query. Please provide more details about your requirement. Please share a video demo to explain your requirement.

Leave a comment