Itvisors / mendix-DataTables

DataTables.net wrapper for Mendix
Apache License 2.0
4 stars 3 forks source link

DataTables for Mendix

This widget provides the DataTables library as Mendix custom widget.

Contributing

For more information on contributing to this repository visit Contributing to a GitHub repository!

Typical usage scenario

Displaying data in a grid with more flexiblity than the standard datagrid allows.

Features

All features can be seen in action in the test/demo project.

Limitations

Atlas UI styling

The show xx entries dropdown may look a little squeezed together vertically.

Adding this to your CSS may help, it probably needs a little adaption to your theme.

div.datatables div.dataTables_wrapper div.dataTables_length select {
    height: 34px;
    padding: 0px 5px;
}

Backlog

Configuration

The context entity

This widget needs a context entity:

It is advised to use a non-persistent entity.

Button and selection microflows

When the table has some form of multiple selection, there is a little snag with the parameters of microflows that receive the selection:

So, for multiple selection you need to have two parameters and check which one is actually passed (not empty). The demo project has an example of this.

Mendix hides this little easter egg for the default DataGrid, for multiple selection, the list parameter will just get the one object when only one object is selected.

Custom row and cell styling

The widget allows row and cell styling based on attribute values. To use a value for styling, turn on its TR data attribute flag. The value will then be included as data- attribute on the table row. Using CSS selection, you can apply custom styling.

It is also possible to apply the styling to a single cell. In addition to the TR data flag for the value attribute, turn on the TD data attribute for the column you want to style.

The demo project has examples of this.

Properties

For the class properties, multiple classes can be entered, separated by a single space.

Datasource

Column definitions

For each column, add an item to the list

Common
Date values
Layout
Extra

Attribute search filters

The widget does not display search filter inputs. To provide search filters, define an attribute of the same type on your context entity.

Filtering on booleans. Filtering on booleans is a little tricky because there is no way to tell the difference between off/false or no selection made. To overcome this, the widget expects an enumeration as attribute on your context entity. The modeler does not allow the value true for an enumeration. For the true value, use enumeration value t. For the false value, anything else, but f would be a good one. The caption can be any value.

Reference search filters

The widget does not display search filter inputs. To provide search filters, define an association to the same entity on your context entity.

Layout

Column visibility

Built-in table classes

The default DataTables stylesheet has the following class names available to control the different styling features of a DataTable.

Class Description
nowrap Disable wrapping of content in the table, so all text in the cells is on a single line
table-bordered Bordered table
table-hover Row highlighting on mouse over
table-striped Row striping
table-condensed More compact table by reducing padding

The nowrap class is DataTables specific, the others are Bootstrap classes.

Selection

The Selection changed callback microflow can be used to create functionality similar to listen to grid. The demo project has examples of this: The master / detail pages.

Buttons

The buttons to use for processing selections. Note that buttons are displayed in the widget itself, above the grid. You can place the buttons in a container on your page using the placement properties. This allows you to create one toolbar containing Mendix action buttons and buttons created by the widget. The demo project has an example of this in the Data Types demo.

Buttons can be enabled or disabled depending on a value in the grid entity. Only one attribute, boolean or enumeration, for each button to keep the widget simple. If there is a lot of business logic involed, you could introduce a new boolean attribute and set it when your object is changed or in a before commit event. For enumerations, use the internal value, not the caption.

Make sure that the default button is always allowed.

Definition

Confirmation

Placement

Enabled

Export

The export cannot be done on the client because the client only has a subset of the data. Therefore, the export is run on the server. The widget sets two values on the context object for the backend to use. For this to work, add two unlimited string attributes (configuration and XPath constraint) to your context entity and choose those in the widget properties.

The demo project has a generic implementation to create data exports.

Please be sure to turn on the apply entity access setting on your export microflow where necessary.

Advanced