Drag and drop from a JQGrid to dhtmlx Scheduler


#1

I have a MVC jQuery JQGrid that I want to click on a column and drop that into a dhtmlx scheduler. I’m using version 4.4. I have dhtmlxscheduler_outerdrag.js loaded into the browser. How do I get onExternalDragIn to fire when the user drags the data item and then lets go?

If I click inside the scheduler the onBeforeDrag fires and if I click again, OnDragEnd fires. OnBeforeDrag does not fire if I’m dragging something from outside of the scheduler. I can’t seem to get any of the other drag events to fire either like onBeforeDeventDragIn, etc.

Thank you.
Brian


Extra mouse click on drag and drop
#2

Hi,

onExternalDragIn fires when some data is being dragged into the scheduler from an outside DHTMLX component as it mentioned on the documentation https://docs.dhtmlx.com/scheduler/api__scheduler_onexternaldragin_event.html

dhtmlxscheduler_outerdrag.js extension also works only with DHTMLX components
https://docs.dhtmlx.com/scheduler/extensions_list.html#outerdrag

Since you don’t use DHTMLX components to drop an external element into the Scheduler, you need to implement the event manually.


#3

Hi Polina:

The external part is solved. What I’m talking about is an already scheduled event doing drag and drop internally within the scheduler. In the month view to stop the drag event requires an extra mouse click. But in the other views (week & day) it does not.

I want to stop the internal drag event (an already scheduled in the calendar event moving from one date to another) upon mouse up, not on a mouse click event.

Secondly, there is a hover tooltip and a drag and drop tooltip. How does one change the text of the drag and drop tool tip? How does one access it?

The drag and drop tool tip is not controlled by the event below. That is for when the user moves the mouse over a scheduled event. I’m talking about when the user clicks on the event and starts to drag. How do you change that text of that tooltip?

Thank you.

Tooltip that shows when the mouse hovers over an event:

        scheduler.templates.tooltip_text = function (start, end, ev) {

            return "<b>WO:</b> " + $(ev.text).attr('data-wono') + "<br/><b>Start date:</b> " +
                scheduler.templates.tooltip_date_format(start) +
                "<br/><b>End date:</b> " + scheduler.templates.tooltip_date_format(end);
        };

#4

Hi,

I want to stop the internal drag event (an already scheduled in the calendar event moving from one date to another) upon mouse up, not on a mouse click event.

How can I reproduce it? As I understnad, you have another behaviour unlike in the sample https://docs.dhtmlx.com/scheduler/samples/01_initialization_loading/01_basic_init.html
Because when you do mouse up while dragging there, event moving stopped. Please clarify that to help me understand what happens in your app, any demo will be appreciate.

How does one change the text of the drag and drop tool tip?

There is tooltip_text template for it.
https://docs.dhtmlx.com/scheduler/common_templates.html#tooltips
Example that demonstrates how it works http://snippet.dhtmlx.com/8f8ba04b3