Custom Controls - Datatables for Laravel [ Datatables for Laravel ](/) Toggle main menu [Docs](https://laravel-datatables.com/docs) [Demos](/demos) [Blog](https://laravel-datatables.com/blog) [Pricing](/pricing) Search ⌘ K [ Log in ](/login) [Docs](https://laravel-datatables.com/docs) [Demos](/demos) [Blog](https://laravel-datatables.com/blog) [Pricing](/pricing) Search docs and demos Type at least 2 characters to search. Demos ### Use Cases - [ Simple Datatable ](https://laravel-datatables.com/demos/use-case-simple) - [ Products Datatable ](https://laravel-datatables.com/demos/use-case-products) - [ Sales Operations ](https://laravel-datatables.com/demos/use-case-sales) ### Features - [ Accessibility ](https://laravel-datatables.com/demos/features-accessibility) - [ Advanced Filtering ](https://laravel-datatables.com/demos/features-advanced-filtering) - [ Aggregate Totals ](https://laravel-datatables.com/demos/features-aggregate-totals) - [ Column Reordering ](https://laravel-datatables.com/demos/features-column-reordering) - [ Custom Controls ](https://laravel-datatables.com/demos/features-custom-controls) - [ Directionality (LTR / RTL) ](https://laravel-datatables.com/demos/features-directionality) - [ Export ](https://laravel-datatables.com/demos/features-export) - [ Frozen Columns ](https://laravel-datatables.com/demos/features-frozen-columns) - [ Frozen Header ](https://laravel-datatables.com/demos/features-frozen) - [ Frozen Header & Columns ](https://laravel-datatables.com/demos/features-frozen-both) - [ Pagination ](https://laravel-datatables.com/demos/features-pagination) - [ Responsive Mobile ](https://laravel-datatables.com/demos/features-responsive-mobile) - [ Row Grouping ](https://laravel-datatables.com/demos/features-row-grouping) - [ Row Selection & Bulk Actions ](https://laravel-datatables.com/demos/features-row-selection-bulk-actions) ### Cell Renderer - [ Action Buttons ](https://laravel-datatables.com/demos/cell-renderer-action-buttons) - [ Avatar ](https://laravel-datatables.com/demos/cell-renderer-avatar) - [ Checkmark ](https://laravel-datatables.com/demos/cell-renderer-checkmark) - [ Color Sample ](https://laravel-datatables.com/demos/cell-renderer-color-sample) - [ Email Link ](https://laravel-datatables.com/demos/cell-renderer-email) - [ External Link ](https://laravel-datatables.com/demos/cell-renderer-external) - [ Friendly Timestamp ](https://laravel-datatables.com/demos/cell-renderer-friendly-timestamp) - [ Image ](https://laravel-datatables.com/demos/cell-renderer-image) - [ Long Text ](https://laravel-datatables.com/demos/cell-renderer-long-text) - [ Phone Link ](https://laravel-datatables.com/demos/cell-renderer-phone-link) - [ Progress Bar ](https://laravel-datatables.com/demos/cell-renderer-progress-bar) - [ Status Badge ](https://laravel-datatables.com/demos/cell-renderer-status-badge) - [ URL Link ](https://laravel-datatables.com/demos/cell-renderer-url) - [ Wire Link ](https://laravel-datatables.com/demos/cell-renderer-wire) ### Value Formatter - [ Compact Number ](https://laravel-datatables.com/demos/value-formatter-compact-number) - [ Currency ](https://laravel-datatables.com/demos/value-formatter-currency) - [ Duration ](https://laravel-datatables.com/demos/value-formatter-duration) - [ Friendly Filesize ](https://laravel-datatables.com/demos/value-formatter-friendly-filesize) - [ Friendly Timestamp ](https://laravel-datatables.com/demos/value-formatter-friendly-timestamp) - [ Locale Timestamp ](https://laravel-datatables.com/demos/value-formatter-locale-timestamp) - [ Number ](https://laravel-datatables.com/demos/value-formatter-number) - [ Percent ](https://laravel-datatables.com/demos/value-formatter-percent) Custom Controls =============== Add custom actions to a datatable toolbar and use Livewire methods to toggle component state from inside the control. Note the use of Livewire's \#\[Renderless\] attribute to avoid re-rendering the entire component when toggling the modal. Also, note the use of @entangle in the custom table control to bind directly to the datatable's showHelloWorldModal property. Say 'Hello World' ### Hello World This modal is controlled by the datatable component state. Close Items per page Columns 10 Current 25 50 100 ​### Manage Columns ID First Name Last Name Email Company Last Contact Created At Apply Cancel Loading... ID First Name Last Name Email Company Last Contact Created At 1 Dashawn Rutherford maximo13@example.net Gaylord-VonRueden 9 months ago 58 minutes ago 2 Lewis Schiller shanelle58@example.net Zulauf, Senger and Mante 11 months ago 58 minutes ago 3 Nelle Schneider swift.elissa@example.org Gislason-Carroll 6 months ago 58 minutes ago 4 Wava Predovic victor.satterfield@example.org Roberts LLC 9 months ago 58 minutes ago 5 Abigayle Kertzmann holly.watsica@example.net McDermott-Bashirian 5 months ago 58 minutes ago 6 Sean Bode precious35@example.org Ziemann PLC 2 weeks ago 58 minutes ago 7 Roger Beer pfeffer.elwyn@example.com Bechtelar, Langosh and Muller 11 months ago 58 minutes ago 8 Kelsi Osinski amya19@example.net Douglas-Mills 1 month ago 58 minutes ago 9 Emanuel Lesch nolan.dana@example.com Murazik-Connelly 11 months ago 58 minutes ago 10 Kole Ernser ttremblay@example.net Kihn PLC 9 months ago 58 minutes ago « Previous Next » 1 - 10 of 10000 1 2 3 4 5 6 7 8 9 10 ... 999 1000 - Demo code is available for licensed customers - ### Related Documentation [Custom Controls Features Inject interactive UI components as custom controls into your datatable.](https://laravel-datatables.com/docs/feature-custom-controls) © 2026 Copyright (C) [ Morrow IT Consulting & Services ](https://morrow-it.services) [Terms of Service](https://laravel-datatables.com/legal/terms) [Privacy](https://laravel-datatables.com/legal/privacy) [Legal Disclosure](https://laravel-datatables.com/legal/disclosure)