How to detach gantt.ext.inlineEditors events?


#1

How can I detach ext events?

When I tried to detach with gantt.detachEvent I get an “Can’t resolved property from “undefined””

Thanks in advance!


#2

Hello,
To detach an event handler, you need to specify its ID. To get the ID of the event handler, you can save it to a variable.
Here is an example:
http://snippet.dhtmlx.com/577ef1cb8


#3

Thanks ramil! Works cool!!


#4

Sorry ramil

I’ve tried, but the detaching works just once and then “TypeError: Cannot read property ‘removeEvent’ of undefined”

https://puu.sh/Ce6WB/df74723b37.png

It happens every time that I unmount the gantt component changing pages.

The code is the next

    componentWillUnmount() {
    this.events.forEach(element => {
      gantt.detachEvent(element)
    });
    this.extEvents.forEach(elm => {
      gantt.ext.inlineEditors.detachEvent(elm)
    })
    gantt.ganttEventsInitialized = false
    gantt.clearAll()
  }

     const onEditStart = gantt.ext.inlineEditors.attachEvent("onEditStart", (state) => {
 //Some Code      
    })
    this.extEvents.push(onEditStart)

    const onBeforeSave = gantt.ext.inlineEditors.attachEvent("onBeforeSave", (state) => {
      //Some Code
      return true
    })
    this.extEvents.push(onBeforeSave)

#5

Hello,
I think you can try using Gantt destructor:
https://docs.dhtmlx.com/gantt/api__gantt_destructor.html
It detaches all events and clears all data. If you don’t have the Enterprise Pro version, Gantt won’t work until you refresh the page, but I suppose, this is what happens in your case.

If that doesn’t help you, could you clarify why do you need to detach inline editors? The events are not fired outside Gantt as there are no inline editors outside Gantt.


#6

Hi ramil,

I tried to use the Gantt destructor without success:

 componentWillUnmount() {
/*  this.events.forEach(element => {
   gantt.detachEvent(element)
 });
 this.extEvents.forEach(elm => {
   gantt.ext.inlineEditors.detachEvent(elm)
 })
 gantt.ganttEventsInitialized = false
 gantt.clearAll() */
var myGantt = Gantt.getInstance();

//destroying a gantt instance
myGantt.destructor();

}

We are using the pro edition, so I can’t understand why I’m getting this error

TypeError: Gantt.getGanttInstance is not a function

Thanks in advance!


#7

Hello,
Gantt and Gantt.getInstance(); commands are available only for the enterprise Pro version. But you don’t need that to use the destructor. Here is the command to destroy Gantt:

gantt.destructor()

If you have the enterprise Pro version, here is the demo where you can see 2 Gantts:
https://files.dhtmlx.com/30d/4179779c1c3222973f4760fc038c327b/react+multiple-gantts.zip
Don’t forget that after installing the modules, you need to install the enterprise version:
https://docs.dhtmlx.com/gantt/desktop__install_with_bower.html#addingprofessionaleditionintoproject