I am loading a grid dynamically in extjs. As you can see below the column "Created" is not wide enough to display whole text in it. I want to set every colu开发者_运维技巧mn's width such that it display's its text completely.
Is this possible to do? Any suggestion?
Thanks for help.
use parameter width: ...
with your column config. As simple as this. I do not see your code so I am guessing.
However it look like you have more vertical space -> maybe break date in 2 lines (using template) would be solution, or you can have special css class just for this cell with smaller letter in order to fit.
Edit: in your case it could be combination of defaultWith in ColumnModel (at least get 120 to fit your date, if more columns grid would adjust) and setColumnWith() dynamically based on length of data and number of columns - logic is up to you
Thanks bensiu, I implemented the login. However, I cannot say that this is the ideal solution but it solves my purpose.
First, i navigate through data and find the longest string in that column (including header name of that column).
// Store the longest string for each column in columns[col].maxstring
// Define a hidden label
{
xtype: 'label',
id: 'lblTab',
hidden: true
}
var lblTab = Ext.getCmp('lblTab');
var hiddenField = Ext.util.TextMetrics.createInstance(Ext.getCmp('lblTab').el);
var widthValue = 0;
// Iterate through each columns to set its maximum width
for(var col in columns) {
// find width of string
widthValue = hiddenField.getWidth(columns[col].maxstring);
// set column width
colModel.setColumnWidth(columns[col].index, widthValue + 20, false);
}
I hope this helps somebody.
精彩评论