≡
×
Plus
Manual
Examples
Reference
Download
Blog
Community
Support
ColumnControl examples
Initialisation and options
Single button
Multiple buttons
Second header row
Multiple rows
Assigning class names to targets
Footer
Content options
Column specific configuration
Internationalisation
Column descriptions
Dropdowns
Dropdowns: Nesting
Dropdowns: Spacers
Dropdowns: Column titles
Ordering
Simple direction buttons
Combined status and trigger button
Status only button
Order direction buttons in dropdown
All ordering options
Column Visibility
Simple column visibility dropdown
Mixed content types
Specific columns
Nested dropdown
Custom nested text
State saving
Column Reordering
Click and drag button
Click to move buttons
Selected columns
Column visibility and reordering
Row Grouping
Grouping data
Disable auto order
Full grouping controls
Search
Automatic type detection
Search in the table footer
Manual type assignment
State saving
Clear all
FixedHeader integration
Dropdown: Search only
Dropdown: With other content
Dropdown: Nested
Dropdown: Clear button
Search - dates
ISO 8601 (with date picker)
ISO 8601 (without date picker)
Auto-locale display (Moment.js)
Auto-locale display (Luxon)
Date rendering (Moment.js)
Date rendering (Luxon)
Format transform (Moment.js)
Format transform (Luxon)
Date only search on date+time data
Custom picker format
Search - lists
Basic search list
Specific columns
Rendered data
Scrolling table
State saving
Options via Ajax only
Options via Ajax and local
Auto search type
Both list and input search
FixedColumns integration
FixedHeader integration
Styling
Bootstrap 3
Bootstrap 4
Bootstrap 5
Foundation
jQuery UI
Fomantic UI
Bulma
Header Alignment: Header Left / Text Auto
Header Alignment: Header and Body Left
