Auto Column Sizing Example

Plugin Options:

GridAutosizeColsMode
viewportSwitchToScrollModeWidthPercent
viewportMinWidthPx
viewportMaxWidthPx
autosizeColPaddingPx
autosizeTextAvgToMWidthRatio

Column Options:

'Locked' and 'Guide' use column width. Others will use content. When retrieving content values for a column, the first defined of the following will be used:

 Column 1 (#)
autosizeMode
rowSelectionMode   rowSelectionCount
valueFilterMode
widthEvalMode
ignoreHeaderText
sizeToRemaining
allowAddlPercent
colValueArray
(input as comma separated list)
column.width
(blank = leave unchanged)
 Column 2 (Title)
autosizeMode
rowSelectionMode   rowSelectionCount
valueFilterMode
widthEvalMode
ignoreHeaderText
sizeToRemaining
allowAddlPercent
colValueArray
(input as comma separated list)
column.width
(blank = leave unchanged)
 Column 3 (Duration)
autosizeMode
rowSelectionMode   rowSelectionCount
valueFilterMode
widthEvalMode
ignoreHeaderText
sizeToRemaining
allowAddlPercent
colValueArray
(input as comma separated list)
column.width
(blank = leave unchanged)
 Column 4 (Random Word)
autosizeMode
rowSelectionMode   rowSelectionCount
valueFilterMode
widthEvalMode
ignoreHeaderText
sizeToRemaining
allowAddlPercent
colValueArray
(input as comma separated list)
column.width
(blank = leave unchanged)
 Column 5 (% Complete)
autosizeMode
rowSelectionMode   rowSelectionCount
valueFilterMode
widthEvalMode
ignoreHeaderText
sizeToRemaining
allowAddlPercent
colValueArray
(input as comma separated list)
column.width
(blank = leave unchanged)
 Column 6 (Start)
autosizeMode
rowSelectionMode   rowSelectionCount
valueFilterMode
widthEvalMode
ignoreHeaderText
sizeToRemaining
allowAddlPercent
colValueArray
(input as comma separated list)
column.width
(blank = leave unchanged)
 Column 7 (Effort Driven)
autosizeMode
rowSelectionMode   rowSelectionCount
valueFilterMode
widthEvalMode
ignoreHeaderText
sizeToRemaining
allowAddlPercent
colValueArray
(input as comma separated list)
column.width
(blank = leave unchanged)
 Column 8 (Random Text)
autosizeMode
rowSelectionMode   rowSelectionCount
valueFilterMode
widthEvalMode
ignoreHeaderText
sizeToRemaining
allowAddlPercent
colValueArray
(input as comma separated list)
column.width
(blank = leave unchanged)

Test Grid

Time taken = -
Viewport width before = 900px
Viewport width after = -
(limits -)
Warning: this example has 500,000 rows, so badly optimised column width tests (ie. checking all rows) may take 100 seconds per column. If it looks like the page has crashed, just wait a while!

View Source:

#
Title
Duration
Random word
% Complete
Start
Effort Driven
Random Text
0
Task 0
5 days and some
good
01/01/2009
Crimea Crimea rumplestiltskin Crimea alteration rumplestiltskin bad dog Crimea
1
Task 1
10 days
bad
01/01/2007
rumplestiltskin vegetable good bad
2
Task 2
10 days
dog
01/01/2006
good bad dog vegetable rumplestiltskin vegetable
3
Task 3
10 days
something
01/01/2009
Crimea dog
4
Task 4
10 days
another word
01/01/2008
platypus platypus platypus bad dog bad Crimea
5
Task 5
5 days and some
good
01/01/2006
Crimea bad Crimea
6
Task 6
10 days
bad
01/01/2006
good platypus bad good Crimea Crimea
7
Task 7
10 days
dog
01/01/2004
vegetable rumplestiltskin good alteration bad bad
8
Task 8
10 days
something
01/01/2000
bad vegetable platypus rumplestiltskin good platypus