jqueryui

Since: Editor 1.0

Use a jQuery UI Modal to display the main editing form.
Please note - this property requires the Editor extension for DataTables.

Description

If you are using DataTables and Editor in a jQuery UI styled site, you will likely wish to use the jQuery UI dialog to display your editing form in so it fits in seamlessly with the rest of your site.

The jqueryui display controller is included in Editor's jQuery UI integration files and it will automatically set the display option's default value to be jqueryui (so you don't need to specify it explicitly).

Options

jQuery UI's modal library has the ability to be customised by its extensive list of options. These options can be specified for the modal used by Editor through the $.fn.dataTable.Editor.display.jqueryui.modalOptions object.

The default value for this object is:

$.fn.dataTable.Editor.display.jqueryui.modalOptions = {
    width: 600,
    modal: true
}

Type

This option can be given in the following type(s):

Examples

Initialise Editor with the jQuery UI display controller:

var editor = new DataTable.Editor({
	ajax: 'php/index.php',
	table: '#myTable',
	display: 'jqueryui'
});

Set a custom width for jQuery UI modal (display is not specified as the default is jqueryui):

$.extend(DataTable.Editor.display.jqueryui.modalOptions, {
	width: 400
});

var editor = new DataTable.Editor({
	ajax: 'php/index.php',
	table: '#myTable'
});