Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Maybe this is quite simple, but I'm still learning JS and stuff. I'm using the plugin https://github.com/troolee/gridstack.js and want to send ajax requests whenever a widget gets repositioned/resized. I wrote this (according to the official readme):

var serialize_widget_map = function (items) {
        console.log(items);
    // onchange position/size
    $('.grid-stack').on('change', function (e, items) {
        console.log(items);
Just to see what the console says: [Object, Object] - maybe because I have 2 widgets on page, but I have to notice that this quantity may vary (widgets might be removed/added dynamically).
How can I "parse" this "items" thing so I can access properties of the widgets?
Just in case someone's looking for the answer to this question, I have solved this problem:
$('.grid-stack').on('change', function (e, items) {
    var widgets = [];
    for (i = 0; i < items.length; i++) {
        var widgetsObj = {
            'widgetId': items[i].el.context.id,
            'x': items[i].x,
            'y': items[i].y,
            'width': items[i].width,
            'height': items[i].height
        widgets.push(widgetsObj);
Because the items variable may contain multiple objects, I loop through it to create a single array of objects with properties I need.
                How to get the  widgetId its showing undefined here my problem is i have added this.serializedData = [                                                 {x: 6, y: 0, width: 6, height: 5, widgetid: 10},                                              ];  I want my custom params in this.
– nilesh
                Sep 23, 2016 at 7:37
                Actually items in change function is array of only widgets starting from the dragged widget and till the end, but items doesn't include widgets before the changed one.
– Yuri Sidorov
                Sep 7, 2017 at 21:20
i came to your question because i was looking for a way to retrieve the current items / nodes
i found this solution, where an event is not required
grid = $('.grid-stack').data('gridstack');
items = grid.grid.nodes;
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.