Drag and Drop Event

Scheduler Javascript
#1

Hello all, im working with a ASP.Net MVC application using the Dhtmlx Scheduler library.

On my web page, I have a table with some information about tasks, using html5 I have enabled one of the:

cells to be draggable. Then in my scheduler, I have added the “onExternalDragIn” event.
Unfortunately, this event is not firing when I drag in the “td” cell.

As of now my event just as a simple alert(“dragged”) so I can test to see if the event fires, eventually I would like to schedule the task to the scheduler with a mix of getActionData and addEventNow methods.

Code for Reference:

            scheduler.attachEvent("onExternalDragIn", function (id, source, e) {
                alert("something is being dragged in");
            });

<td draggable="true"> <span id="drag" class="glyphicon glyphicon-star"></span> </td>

Thanks for your time and your help!

#2

onExternalDragIn currently works only for drag-n-drop from dhtmlx components.
You can add native drop handler to the scheduler’s container. Something like next

dhtmlxEvent( document.getElementById("scheduler_here"), "ondrop", function(ev){ var info = scheduler.getActionData(ev); scheduler.addEventNow({ start_date:info.date }); })

#3

Alright, thanks for the tip.
I’ll try your native method posted above.

Thanks Stanislav!

#4

Thanks for the help!
I got it to work, but not using the DhtmlxEvent.

instead this is what I did:

Div containing the scheduler, added the appropiate drop events

<div id="scheduler_here" ondragover="allowDrop(event)" ondrop="drop(event)" class="dhx_cal_container" style='width:1130px; height:900px;'>

The event functions:

[code] function allowDrop(e) {
e.preventDefault();
}

function drop(e) {
    var info = scheduler.getActionData(e);
    scheduler.addEventNow({ start_date: info.date, engineer_id: info.section });
}[/code]

Thanks Stanislav!
hope this helps people in the future!

1 Like