Width Not Set When Defining Columns

Thread ID:	Created:	Updated:	Platform:	Replies:
150590	Jan 13,2020 05:12 AM UTC	Jan 15,2020 10:55 AM UTC	Vue	3

Subscribe to this post

Tags: Data Grid

Marius Lian

Asked On January 13, 2020 05:12 AM UTC

Hi Syncfusion,

I define columns programatically like this:

https://www.screencast.com/t/uYGSHUbbk

and setting columns properties like this:

https://www.screencast.com/t/agWpBJTw

Everything works here except width. So headerText works, columns template works but width is stretched to the lenght of the longest cell. I do not use autoFitColumns.

I can see in the code that widht is not added:

https://www.screencast.com/t/jQtza7q21Ud

Why is width not applied to the grid?

Thanks,

Marius

Reply | Reply with quote

Balaji Sekar [Syncfusion]

Replied On January 13, 2020 11:57 AM UTC

Hi Marius,

Greetings from syncfusion support.

Query#: Why is width not applied to the grid?

Based on your query we have prepared a sample and we suggest you to follow the below way to achieve your requirement. Please refer the below code example and sample for more information.

var pvt = {

key: true

}

export default {

data() {

return {

data: data,

grid: "",

toolbar: ["Add", "Delete", "Update", "Cancel"],

flag: true,

pageOption: {

pageSize: 12

editSettings: {

allowEditing: true,

allowAdding: true,

allowDeleting: true,

mode: "Batch"

}

};

methods: {

dataBound: function(args) {

var obj = {field: "ShipCountry", headerText: "Ship Country", width: "300"};

this.$refs.grid.ej2Instances.columns.push(obj);

if(pvt.key) { // you need to push this new column to the grid’s columns property and call the refreshColumns method to achieve your requirement

pvt.key = false; //It helps to prevent the recursive call

this.$refs.grid.ej2Instances.refreshColumns();

}

provide: {

grid: [Edit, Toolbar, Page]

}

};

Sample: https://codesandbox.io/s/146774-dynamic-grid-modified-vycrq

Regards,

Balaji Sekar.

Reply | Reply with quote

Marius Lian

Replied On January 14, 2020 04:35 AM UTC

Ok, thank!

Reply | Reply with quote

Dhivya Rajendran [Syncfusion]

Replied On January 15, 2020 10:55 AM UTC

Hi Marius,

Thanks for your update. Please get back to us if you need further assistance from us.

Regards,

R.Dhivya

Reply | Reply with quote

Width Not Set When Defining Columns

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US