Version 5.4 Released!

Click to checkout the new features

Old Documentation
You are browsing documentation for an old version of Tabulator. Consider upgrading your project to Tabulator 5.4

Upgrade Guide v5.1 to 5.2

Previous Version Upgrades

If you are upgrading from any version of tabulator below version 5.1, you should read the v5.0 to 5.1 upgrade guide first.

Menus

Menu Containter

As a result of the introduction of the built in popup functionality in this release, the menu module is no longer responsible for creation of its own popups.

For this reason the module specific menuContainer has been replaced with the table wide popupContainer option.

Anywhere you used to use the menuContainer option:

var table = new Tabulator("#example-table", {
    menuContainer:true, //show menus relative to the table element
});

You should now use the popupContainer option:

var table = new Tabulator("#example-table", {
    popupContainer:true, //show menus and other popups relative to the table element
});

Menu Generation Functions

The order of the arguments passed into the menu generation function on any of the standard menu options has been changed, to fit with the general pattern throughout Tabulator of the event being the first argument passed into a function

Any of the menu generation functions with the argument list that was ordered component, then e

var table = new Tabulator("#example-table", {
    rowContextMenu: function(component, e){

    }
});

Should swap the arguments round to be e, then component

var table = new Tabulator("#example-table", {
    rowContextMenu: function(e, component){

    }
});

Tooltips

With the migration of tooltip functionality to the new Tooltip module the tooltipGenerationMode has become redundant and can be removed.

You should remove any use of the tooltipGenerationMode option:

var table = new Tabulator("#example-table", {
    tooltipGenerationMode:"hover",
});

Editors

Select Editor

The select editor has been removed in this release and replaced with the more configurable list editor.

Column definitions using the select editor

{title:"Example", field:"example", editor:"select"}

Should be replaced with the list editor

{title:"Example", field:"example", editor:"list"}
Parameter Changes
The paramters and functionality of the list editor are not the same as the select editor. Please read through the List Editor Documentation to decide the correct params for your usage case.

Autocomplete Editor

The autocomplete editor has been removed in this release and replaced with the more configurable list editor.

Column definitions using the autocomplete editor

{title:"Example", field:"example", editor:"autocomplete"}

Should be replaced with the list editor

{title:"Example", field:"example", editor:"list", editorParams:{autocomplete:true}}
Parameter Changes
The paramters and functionality of the list editor are not the same as the autocomplete editor. Please read through the List Editor Documentation to decide the correct params for your usage case.

Validation

Cell Component Validity

The cell component isValid function has been updated to return a value of true if the cell passes validation, or an array of failed validators if it fails validation.

So where you used to check if a cell was valid by checking the trutheyness of the retured value:

var validCell = cell.isValid();

You will now have to check that it is explicitly true otherwise the array off failed validators returned when it fails would show as a pass.

var validCell = cell.isValid() === true;
Donate