Docs for the datatable widget

7.x-dev/base-components.md

@@ -46,6 +46,34 @@ Note that you can further customize this using custom attributes. If you define
 
 <hr>
 
+<a name="datatable"></a>
+### DataTable
+
+Show a datatable _anywhere you want_, so the admin to easily list, filter, search and perform other operations on entries of an Eloquent model. The datatable component is a extension of a CrudController - so a CRUD for that entity needs to be already set up, and passed to this component as a parameter:
+
+```php
+<x-datatable 
+    name="invoices_table"
+    controller="\App\Http\Controllers\InvoiceCrudController" 
+    :configure="function($crud, $parent) { // config }" 
+    :updatesUrl="false" 
+ />
+```
+
+The datatable will pick up everything that in your `setupListOperation()`. You can then further add/remove/configure functionality using the configuration closure:
+
+```php
+
+<x-datatable 
+    name="invoices_table"
+    controller="\App\Http\Controllers\InvoiceCrudController" 
+    :configure="function($crud, $parent) { if ($parent) { $crud->addClause('where', 'customer_id', $parent->id); } }" 
+    :updatesUrl="false" 
+ />
+```
+
+<hr>
+
 
 <a name="menu-separator"></a>
 ### Menu Separator

7.x-dev/base-widgets.md

@@ -349,6 +349,27 @@ class ChartjsPieController extends ChartController
 
 <hr>
 
+<a name="datatable"></a>
+### DataTable
+
+Shows a datatable component from a particular CrudController. For more info about the configuration parameter, please see the [datatable component docs](/docs/{{version}}/base-components#datatable).
+
+```php
+[
+    'type' => 'datatable',
+    'controller' => 'App\Http\Controllers\Admin\PetShop\InvoiceCrudController',
+    'name' => 'invoice_crud',
+    'configure' => function($crud, $parent) {
+        // you can use this closure to modify your CrudController definition. 
+        if ($parent) {
+            $crud->addClause('where', 'owner_id', $parent->id);
+        }
+    }
+]
+```
+
+
+<hr>
 
 <a name="div"></a>
 ### Div