CODEWITHSUNDEEP
javascriptjqueryfullcalendar
user431619
user431619

Reputation:

fullcalendar custom end date

Is it possible to create a custom end date, based on a choice from a selectbox? Let say I have this HTML - It has a title, and a duration of an event:

<select name="event-title" id="event-title">
  <option value="Træning" data-duration="01:00">Træning</option>
  <option value="Træning + Måling" data-duration="01:15">Træning og måling</option>
  <option value="Billeder" data-duration="00:20">Foto Session</option>
</select>

When clicking add event, then the end date/time, should be the day and starttime clicked + the duration:

See code here with comments:

select: function (start, end, allDay) {
  $('#fc_create').click(); //trigger modal
  var startHours = moment(start).format('hh:mm'),
      started = start,
      ended = end;

  //started variable could return: Mon Jan 11 2016 09:10:00 GMT+0000

  //Set value to selected time
  $("#event-start").val(startHours);

  $(".antosubmit").on("click", function () {
    var title = $("#event-title").val(),
        duration = $("#event-title").find("option:selected").data('duration');

    if (end) {
      //Returns ex: Mon Jan 11 2016 09:35:00 GMT+0000
      // However, the end time here should be the starttime + the duration - So in this it should be: 10.10
      // as the start time was 09:10 + a duration on 1 hour (from the selectbox)
      ended = end 
    }

    if (title) {
      calendar.fullCalendar('renderEvent', {
        title: title,
        start: started,
        end: end,
        allDay: false
      },
      true); // make the event "stick"
    }
    $('#title').val('');
    calendar.fullCalendar('unselect');

    $('.antoclose').click();

    return false;
  });
}

Upvotes: 3

Views: 516

Answers (1)

Chintan Mirani
Chintan Mirani

Reputation: 1465

Try this!

var title = $("#event-title").val(),
        duration = $("#event-title").find("option:selected").data('duration');

var newDurationDate = moment(start.format('YYYY-MM-DD')+' '+duration+':00');
var durationInMinutes = (newDurationDate.hour()*60)+newDurationDate.minute());

//Overwrite value of end
end = moment(start).add(durationInMinutes, 'minutes');
console.log(endDate.format('YYYY-MM-DD HH:mm'));

if (end) {
      //Returns ex: Mon Jan 11 2016 09:35:00 GMT+0000
.........

Upvotes: 1

Related Questions