Custom add/adit task form in lightbox

Gantt
#1

Is there a way add add custom add/edit form for tasks?
For example I have a html form with form elements: textfield, textarea, select lists, may be checkboxs etc. and I want to know how to show it in lightbox and get values after submit in this case?

I saw some comments that I should rewrite showLightbox function but I don’t understand in what way.

Do you have any ideas or examples?

#2

Currently there is no api method for replacing the default lightbox.
The way to replace the built-in form with the custom one, is to

  1. detect when the lightbox is about to be shown
  2. block the default lightbox
  3. show a custom form and fill-in the task data.

The is several ways to do it. But in all cases the custom form will be completely external to the dhtmlxGantt. It has to be shown, filled-in and saved manually.

For items (1) and (2) you can use either onBeforeLightbox event, or overwrite the showLightbox method:

gantt.attachEvent(“onBeforeLightbox”, function(id) {
// show custom form
return false;//return false to prevent showing the default one
});

docs.dhtmlx.com/gantt/api__gantt … event.html

OR

gantt.showLightbox = function(id){
// show custom form
};

docs.dhtmlx.com/gantt/api__gantt … htbox.html

When user saves the form, you’ll need to manually get form values and update the appropriate task using a public API. Note, that when lightbox was triggered by the new task, which should be deleted in case user clicks ‘Cancel’ (user clicks ‘plus’ button), the task object will have a ‘$new’ property set

docs.dhtmlx.com/gantt/api__gantt_addtask.html
docs.dhtmlx.com/gantt/api__gantt_updatetask.html
docs.dhtmlx.com/gantt/api__gantt_deletetask.html

Unfortunately there is no ready example

#3

Big thanks for your answer.