Add an event on deselect

[agencefacton]

Hello,

A little beast, there is no event on deselect an hour ?!

Thank

[agencefacton]

Or when select an hour, receive all the hour of the table ?

[agencefacton]

It's Ok, i'm find :

$("#day-schedule").on('selected.artsy.dayScheduleSelector', function (e, selected) {

        hours = $("#day-schedule").data('artsy.dayScheduleSelector').serialize();

        json = '{"opening":[';

        for (i = 0; i < 6; i++) {           
            for (y = 0; y < hours[i].length; y++) {
                json += '{"day":'+i+',"start":"'+hours[i][y][0]+'","end":"'+hours[i][y][1]+'"},';
            }
        }

        json = json.slice(0, -1) + ']}';

        $.ajax({
            method: "post",
            dataType: "json",
            url: "your_url",
            data: $.parseJSON(json)
        });

    });

[starsirius]

Reopened this issue since the "deselected" event can be useful. Thanks!

[lynvidal]

Hi,

I'm rather beginner in coding, so this may not be relevant at all, but I've added this line after the deselect call, and now, the unselection seems to be correctly triggered: plugin.$el.trigger('selected.artsy.dayScheduleSelector', [getSelection(plugin, plugin.$el.find('.time-slot[data-day="' + day + '"]').filter("[data-selected='selected']").first(), plugin.$el.find('.time-slot[data-day="' + day + '"]').filter("[data-selected='selected']").last())]);

Hope this can help!

[barrychapman]

@lynvidal Where did you add this line?

[lynvidal]

DayScheduleSelector.prototype.attachEvents = function () { var plugin = this , options = this.options , $slots;

this.$el.on('click', '.time-slot', function () {
  var day = $(this).data('day');
  if (!plugin.isSelecting()) {  // if we are not in selecting mode
    if (isSlotSelected($(this))) {      
        plugin.deselect($(this)); 
        /* Change from original script */
        /* Starting point of the new selection is first of 'selected' elements for the current day, and ending point is the last */
        plugin.$el.trigger('selected.artsy.dayScheduleSelector', [getSelection(plugin, plugin.$el.find('.time-slot[data-day="' + day + '"]').filter("[data-selected='selected']").first(), plugin.$el.find('.time-slot[data-day="' + day + '"]').filter("[data-selected='selected']").last())]);
    }
    else {  // then start selecting
      plugin.$selectingStart = $(this);
      $(this).attr('data-selecting', 'selecting');
      plugin.$el.find('.time-slot').attr('data-disabled', 'disabled');
      plugin.$el.find('.time-slot[data-day="' + day + '"]').removeAttr('data-disabled');
    }
  } else {  // if we are in selecting mode
    if (day == plugin.$selectingStart.data('day')) {  // if clicking on the same day column
      // then end of selection
      plugin.$el.find('.time-slot[data-day="' + day + '"]').filter('[data-selecting]')
        .attr('data-selected', 'selected').removeAttr('data-selecting');
      plugin.$el.find('.time-slot').removeAttr('data-disabled');
      plugin.$el.trigger('selected.artsy.dayScheduleSelector', [getSelection(plugin, plugin.$selectingStart, $(this))]);
      plugin.$selectingStart = null;
    }
  }
});

etc.

[lynvidal]

@barrychapman Does it help?

[RevaJillu]

@lynvidal Thank you! It works great. Now, I am able to get deselected values