How to save coordinates, which actually changed

Question

I ran into this problem.

When I change the position of the widget, such as drag two widgets. Using the event 'change' to get these updated widgets. I did check the changed position.

if (stack_item.data('gs-x') != items[i].x || stack_item.data('gs-y') != items[i].y) {

I reload the page. Change position of the widget, and nothing happens. Then again change the position of the same widget and it is saved.

why? How to save coordinates, which actually changed?

$(document).on('change', '.grid-stack', function(event, items) {
  var updated_widgets = {};
  for (var i = 0; i < items.length; i++) {
    var widget = items[i].el.find('.dashboard-widget');
    var stack_item = widget.parent();
    // Let's see if cordinates actually changed
    // (this change event reports changes even when nothing changed)
    if (stack_item.data('gs-x') != items[i].x || stack_item.data('gs-y') != items[i].y) {
      updated_widgets[widget.data('widget-id')] = {
        'x': items[i].x,
        'y': items[i].y
      }
    }
  }

  if (Object.keys(updated_widgets).length > 0) {
    $.post('/dashboard_widgets/update_positions', {
      '_method': 'patch',
      'updated_widgets': updated_widgets
    });
  }
});