Fullcalendar select wrong end date

Question

I am using selectable function where when user select a date, it will shows the start and end date in a modal. but the the end date showed is extra one day from the actual selected date. for example, of i click on 1st march, the end date will showed 2nd march. here is my code:

select: function (start, end, allDay, jsEvent, view) {
          var view = $('#calendar').fullCalendar('getView');
          $("#EndDate").val('');
          alert(end);

          if (view.name === "month") {
            $('#DateForm').modal('show');
            $("#EndDate").val(start.format('ddd, DD-MMM-YYYY, hh:mm a'));
          } else {
          }
        }

Answer 1

What you're seeing is the correct, documented behaviour. The documentation of the "end" property of an event states:

The exclusive date/time an event ends. [...] It is the moment immediately after the event has ended. For example, if the last full day of an event is Thursday, the exclusive end of the event will be 00:00:00 on Friday!

See https://fullcalendar.io/docs/event-object for more.

---

P.S. the line var view = $('#calendar').fullCalendar('getView'); in your code above is redundant - you already have access to the view via the parameter of the same name in your callback. You can remove this line and the code will continue to work.

Answer 2

You can do this in this way

      select: function (start, end, allDay, jsEvent, view) {
      var endDate = new Date(end);
      beforeDay = new Date(endDate.getFullYear(),endDate.getMonth(),endDate.getDate() - 1);
      $("#EndDate").val(beforeDay.format('ddd, DD-MMM-YYYY, hh:mm a'));
     }