Missing Event reference on external drag & drop item

Asked by Luca
2 years ago.

Hi everyone! I was hoping for my Javascript code to work properly. I began programming in JS not so long ago and i'm having some problems lately.
More specifically i would like my script to make an AJAX client-side call to the Daypilot Database in order to register as event on db, the external items i want to move on, as soon as i drag them on the event calendar. The Ajax calls i make for the events created with the standard creation mode right inside the calendar seem to work. The problems begin when i drag external elements on it. The method " DayPilot.Calendar.makeDraggable()" provided from the framework should pass the execution control flow to the "EventMove()" method, once the element has been dropped on calendar as the documentation suggests ("After dropping the object the standard EventMove event is triggered.."). So i thought i could make my "POST" ajax call right inside of it obtaining, unfortunately, this runtime error on console: "{"$.id":["The JSON value could not be converted to System.Int32. Path: $.id | LineNumber: 0 | BytePositionInLine: 11."]}" associated with the HTTP bad request Status response (error 400). Should i interpret it as conversion error due to wrong input format of the event attributes or is it possible that the event has not been even created once the html element has been dropped?
Like i said before i'm not that good at programming in JS so i could missing some basic programming logic for it, but i hope i provided a clear enough explanation of the problem.
I'm gonna attach my "EventMove()" method screenshot to the post if it can be helpful for troubleshooting.
Thanks for the more than appreciated help i could receive.

Luca

how-to javascript

Comment posted by Luca
2 years ago.

Sorry, i uploaded the wrong photo, the correct one is this one.
https://ibb.co/6ZXCTZX

Comment posted by Dan Letecky [DayPilot]
2 years ago.

I recommend printing the whole args object to console like this:

console.log("args", args);

This will let you inspect the content using the browser developer tools.

BTW, this line:

console.log(args.e.id);

prints the function source. You need to change it to this to print the id:

console.log(args.e.id());

Comment posted by Dan Letecky [DayPilot]
2 years ago.

You also execute two ajax calls using jQuery. But these calls are executed asynchronously. The second call doesn't wait for the first call to complete.

You may need to rework this logic, ideally make just a single ajax call that does all the processing.

Comment posted by Luca
2 years ago.

Thanks for the infos Dan; i made a single POST call inside of it and i managed to made me print the id with the correct form of log method you wrote me. The event it results then created, and i guess this moves the problem to the wrong JSON conversion of the attributes. I must suppose, then, that this instruction "data: JSON.stringify(params)" does not create a valid format for the event to be processed when the AJAX request succeeds through "success: function (data) {.." even if i don't understand why.

Answer posted by Luca
2 years ago.

Solved! Dunno why, but it seems that removing the ID attribute deputies to the AJAX conversion the content is correctly sent to db. If someone could explain me why this trick worked should be great. By the way thanks for answering Dan :)

This question is more than 1 months old and has been closed. Please create a new question if you have anything to add.

Missing Event reference on external drag & drop item

Products

Learn

Get Support

DayPilot Pro