Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

274
Views
Tabulator - custom editor with blur exceeding active cell

I'm working on a custom editor (dropdown with search & ajax-fetched items based on said search) and I need to keep cell in the edit mode after blur event.

As of Tabulator 5.1 blur must be handled either by calling cancel or success. If that is not satisfied Tabulator cancels the edit.

I've checked how built-in Autocomplete editor works around this but the solution lies around input type search and still adheres to this constraint.

How can this be achieved? For me personally it would make sense if the function implementing a custom editor would take an extra param passtrough changing the signature to (cell, onRendered, success, cancel, editorParams, passthrough). We could call passthrough() inside blur event to indicate we are ok with exceeding the active cell bounds and do not want to cancel the edit.

I've tried

  • not resolving blur event -> leads to fallback cancel
  • calling success, cancel -> leads to their respective results
  • commenting out blur handler -> results in fallback cancel too
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Tabulator already has a built in autocomplete editor that allows for text searching and ajax lookup.

Full details can be found in the Editor Documentation

If you want to build a custom editor, i would suggest your starting point should be to look at the code for the existing select and autocomplete editors to see how the do this as they already work correctly, there is no need for an additional passthrough argument.

There has been no change in behaviour to the blur event behavior on editors in any of the recent releases of Tabulator, neither v5.0 or v5.1

You will see that on lines 226 and 405 of the select editor, it uses a mousedown event to track when a user clicks on elements relating to the editor and sets a blurable property to false, and then back to true a few ms later:

listEl.addEventListener("mousedown", function(e){
blurable = false;

    setTimeout(function(){
        blurable = true;
    }, 10);
});

On line 559 it listens to the blur event on the editor, if the blurrable flag is false, ie someone just click on an element of the editor, then it ignores the blur event and dosnt cancel the edit

input.addEventListener("blur", function(e){
    if(blurable){
        cancelItem();
    }
});
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!