Field type plug-ins

Field type plug-ins provide the ability to customise a single field in a reusable script, allowing any field in the editing form to be customised to match your exact needs. For example you might wish to use a date picker that works with Bootstrap, or the excellent Selectize library.

A number of plug-ins have been built for Editor and are ready to be used below. You can also create your own custom plug-in if you don't find one that suits your needs here.

How to use

Using a field type plug-in is a simple matter of including the Javascript for the plug-in (and any CSS or external libraries that the plug-in depends upon) and then initialising the field using the fields.type option, set to the plug-in type. For example, to use the ckeditor plug-in:

new $.fn.dataTable.Editor( {
    ajax: "../php/todo.php",
    table: "#todo",
    fields: [ {
        label: "Description:",
        name: "description",
        type: "ckeditor"
    } ]
} );

Plug-ins

Bootstrap DatePicker Date picker control which is tightly integrated with Bootstrap for styling.
Bootstrap DateTimePicker (1) Date and time input selector styled with Bootstrap
Bootstrap DateTimePicker (2) Another Date and time input selector styled with Bootstrap
CKEditor WYSIWYG editor
Chosen Use the Chosen library with Editor for complex select input options.
Field set title Field grouping display
jQuery UI AutoComplete Use jQuery UI's AutoComplete library with Editor to allow easy and accurate input of data.
Masked inputs Display user input in a given format
Quill WYSIWYG editor that does not use iframes
Read only display Read only field which does not display an input option
Select2 Use the Select2 library with Editor for complex select input options
Selectize Use the Selectize library with Editor for complex select input options
TinyMCE WYSIWYG editor