Tabulator: I am using validation mode manual but I want to block on cell if not valid

Question

I am using Tabulator with validation mode Manual or Highlight. But at the same time I am also interested in the blocking functionality. But for some reasons, I don't want to check for all Validators on specific row editing, that's why I am using highlight or manual mode.

So my question is how can I block user when ValidationFailed is called on the same cell (with some conditions)

Answer 1

Reverting the Value

Youif you want to revert the value, could use a mix of the getOldValue and setValue function on the cell component passed into the validationFailed callback to retrieve the old value of the cell and set it back.

You would then probably want to call the *clearValidation function on the cell to clear the invalid flag now that the value has been reset.

var table = new Tabulator("#example-table", {
    validationFailed:function(cell, value, validators){
        cell.setValue(cell.getOldValue());
        cell.clearValidation();
    },
});

Re-triggering the Edit

If you want to keep the user on the cell to keep on editing then you should call the editfunction on the cell component

var table = new Tabulator("#example-table", {
    validationFailed:function(cell, value, validators){
        setTimeout(() => { //give the edit time to finish before retriggering
            cell.edit(); //retrigger the edit
        }, 100)
    },
});

Blocking Validation Mode

Im assuming that you want to take this approach because you want to flag some columns as invalid without blocking the edit, and some that you do want to block. If you want to block all invalid edits then you should just use the blocking validation mode:

var table = new Tabulator("#example-table", {
    validationMode:"highlight", //highlight cells with validation errors but dont stop the edit
});