How Do These Callbacks Fit Into A Configuration Object?

Question

I am loving gridster.js, but I can't figure out how to use its callbacks. The documentation states the following can be passed into the Gridster configuration object:

draggable.stop: function(event, ui){}
// A callback for when dragging stops.

Here is what I'm trying but I get the error Uncaught SyntaxError: Unexpected token . on the draggable.stop line.

var gridster = $(".gridster ul").gridster({
                        widget_margins: [5, 5],
                        widget_base_dimensions: [90, 90],
                        draggable.stop: function(){console.log("drag completed")}
                    }).data('gridster');

What is the correct syntax to use here?

Answer 1

It seems to mean that the draggable option you provide needs to be an object literal, and you specify the stop property as a callback. Something like:

var gridster = $(".gridster ul").gridster({
                   widget_margins: [5, 5],
                   widget_base_dimensions: [90, 90],
                   draggable: {
                       stop: function () {
                           console.log("drag completed");
                       }
                   }
               }).data("gridster");

Seems to be confirmed here: https://github.com/ducksboard/gridster.js/issues/18