Data is erased when updateRow and Mutator implemented.

I’ve implemented Mutator to limit the Length of entered data and also an update Row when the Row selected. but row data is erased when row is selected.

myDiv.tabulator("updateRow", data.ID, {selected:'1'});

mutator:function(value, type, data){
    value = value.substring(0, 15);
   return value;
},

Am I doing something wrong? And How is the best way to implement a Mask?

[olifolkerd]

Great News!

In answer to you next question, you can mask any input with the html5 _pattern_ attribute.

In this case you would need to create your own variant of the input editor with the appropriate pattern:

//create editor
datePatternInputEditor = function(cell, value, data){
    //create and style input
    var input = $("<input type='text' pattern='\d{4}-\d{1,2}-\d{1,2}'/>");
    input.css({
        "padding":"4px",
        "width":"100%",
        "box-sizing":"border-box",
    })
    .val(value);
    if(cell.hasClass("tabulator-cell")){
        setTimeout(function(){
            input.focus();
        },100);
    }

    //submit new value on blur
    input.on("change blur", function(e){
        cell.trigger("editval", input.val());
    });

    //submit new value on enter
    input.on("keydown", function(e){
        if(e.keyCode == 13){
            cell.trigger("editval", input.val());
        }
    });

    return input;
},

//assign editor to column
$("#example-table-demo").tabulator({
    columns:[
        {title:"date", field:"date", editor:datePatternInputEditor },
    ]
});

[codevite]

It works Perfect. Thank you a lot!

Its possible to show a Mask in Editable Div? Ex: YYYY-MM-DD