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

210
Views
How to disable the feature to create new item via ctrl+click in vis-timeline?

I am using vis-timeline 7.4.7.

There is a feature, the website says:

When the Timeline is configured to be editable (both options selectable and editable are true), the user can: ... Create a new range item by dragging on an empty space with the ctrl key down...

I need to use the options.add=true, also the editable and the selectable, because of the other features I am using.

My question is: is there a way to disable the "add new item with ctrl/meta + click-and-drag" feature?

I found that it is handled by Input.domHandler -> ... -> recognize -> ... -> propagatedHandler -> _onDragStart -> _onDragStartAddItem, but I could not find a way to set an option to disable this.

Note: That would be a great workaround to hide the new blue element (with a build-in text says "new item"), but the new element does not have any special class or anything I could target with CSS. (The item will not stay alive, as I can catch it with the onAdd function, but it runs only AFTER the user released the mouse button)

My current workaround is that I add my own class to all the elements I create, so I can tartet the new element with :not(). Well... not the best solution :(

Note2: it is happening not only with ctrlKey, but also with metaKey

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

How i got around it is like this.

A bit hacky. On the onAdd event listener I did the following.


function isUUID(uuid) {
    var regex = /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i;
    return regex.test(uuid);
}

    onAdd: (item, callback) => {
        if (item.content == 'new item' && isUUID(item.id) ) {
            callback(null)
        } else {
            //emits('onAdd', item);
            callback(item);
        }


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!