Подтвердить что ты не робот

Как сделать прошедшую дату недоступной в fullcalendar?

Проблема заключается в том, как отключить выбор в PAST DATES в режиме полнокалендарного месяца/недели.

Я хочу, чтобы пользователю не разрешалось нажимать/выбирать последние даты.

enter image description here

Вот некоторые фрагменты кода для Google, которые я пытаюсь реализовать при рендеринге событий:

selectable: true,
selectHelper: false,
select: function(start, end, allDay) {
        var appdate = jQuery.datepicker.formatDate('<?php echo $DPFormat; ?>', new Date(start));
        jQuery('#appdate').val(appdate);
        jQuery('#AppFirstModal').show();
    },
    eventRender: function(event, element, view)
    {
        var view = 'month' ;
       if(event.start.getMonth() !== view.start.getMonth()) { return false; }
    },

Но он не работает, хотя.

Я тоже попробовал CSS CSS, и это поможет мне скрыть только текст даты, но selectable все еще работает в окне lastdate.

.fc-other-month .fc-day-number {
     display:none;
}

Я действительно застрял в этой проблеме. Пожалуйста, помогите мне. Спасибо...

4b9b3361

Ответ 1

Я сделал это в своем полном календаре, и он отлично работает.

вы можете добавить этот код в свою функцию выбора.

 select: function(start, end, allDay) {
    var check = $.fullCalendar.formatDate(start,'yyyy-MM-dd');
    var today = $.fullCalendar.formatDate(new Date(),'yyyy-MM-dd');
    if(check < today)
    {
        // Previous Day. show message if you want otherwise do nothing.
        // So it will be unselectable
    }
    else
    {
        // Its a right date
        // Do something
    }
  },

Надеюсь, это поможет вам.

Ответ 2

Мне нравится этот подход:

select: function(start, end) {
    if(start.isBefore(moment())) {
        $('#calendar').fullCalendar('unselect');
        return false;
    }
}

Он по существу отключит выделение по временам до "сейчас".

Отменить выбор

Ответ 3

Благодаря этому ответу, я нашел решение ниже:

$('#full-calendar').fullCalendar({
    selectable: true,
    selectConstraint: {
        start: $.fullCalendar.moment().subtract(1, 'days'),
        end: $.fullCalendar.moment().startOf('month').add(1, 'month')
    }
});

Ответ 4

Вы можете комбинировать:

-крытый текст CSS, как упоминалось в вопросе

- отключить кнопку PREV в текущем месяце

- отметьте дату в dayClick/eventDrop и т.д.:

dayClick: function(date, allDay, jsEvent, view) {
    var now = new Date();
    if (date.setHours(0,0,0,0) < now.setHours(0,0,0,0)){
        alert('test');
    }
    else{
         //do something
    }
}

Ответ 5

В FullCalendar v3.0 есть свойство selectAllow:

selectAllow: function(info) {
    if (info.start.isBefore(moment()))
        return false;
    return true;          
}

Ответ 6

Я попробовал этот подход, работает хорошо.

$('#calendar').fullCalendar({
   defaultView: 'month',
   selectable: true,
   selectAllow: function(select) {
      return moment().diff(select.start) <= 0
   }
})

Наслаждайтесь!

Ответ 7

ниже - это решение, которое я использую сейчас:

        select: function(start, end, jsEvent, view) {
            if (moment().diff(start, 'days') > 0) {
                $('#calendar').fullCalendar('unselect');
                // or display some sort of alert
                return false;
            }

Ответ 8

Нет необходимости в длинной программе, просто попробуйте это.

checkout.setMinSelectableDate(Calendar.getInstance().getTime());    
Calendar.getInstance().getTime() 

Дает нам текущую дату.

Ответ 9

В fullcalendar 3.9 вы можете предпочесть параметр validRange function parameter:

validRange: function(nowDate){
    return {start: nowDate} //to prevent anterior dates
},

Недостаток: это также скрывает события до этой даты

Ответ 10

Это то, что я сейчас использую

Также добавлена функция .add(), чтобы пользователь не мог добавить событие в один и тот же час.

select: function(start, end, jsEvent, view) {
               if(end.isBefore(moment().add(1,'hour').format())) {
               $('#calendar').fullCalendar('unselect');
               return false;
             }

Ответ 11

*You can use this*

var start_date= $.fullCalendar.formatDate(start,'YYYY-MM-DD');

 var today_date = moment().format('YYYY-MM-DD');

 if(check < today)

 {    alert("Back date event not allowed ");   
 $('#calendar').fullCalendar('unselect');    return false

 }

Ответ 12

Я использовал опцию validRange.

validRange: { start: Date.now(), end: Date.now() + (7776000)//sets end dynamically to 90 days after now (86400*90) }

Ответ 13

В Fullcalendar я достиг этого благодаря событию dayClick. Я думал, что это простой способ сделать это.

Вот мой код..

 dayClick: function (date, cell) {
              var current_date = moment().format('YYYY-MM-DD')
              // date.format() returns selected date from fullcalendar
              if(current_date <= date.format()) {
                //your code
              }
            }

Надеюсь, что это помогает прошлым и будущим датам будет невозможно выбрать..

Ответ 14

если какой-либо ответ не работает для вас, попробуйте это, я надеюсь, что это работает для вас.

 select: function(start, end, allDay) {                

              var check = formatDate(start.startStr);
              var today = formatDate(new Date());

              if(check < today)
              {
                 console.log('past');                     
              }
              else
              {                    
                console.log('future');
              }
}

а также создать функцию для формата даты, как показано ниже

function formatDate(date) {
      var d = new Date(date),
          month = '' + (d.getMonth() + 1),
          day = '' + d.getDate(),
          year = d.getFullYear();

      if (month.length < 2) month = '0' + month;
      if (day.length < 2) day = '0' + day;

      return [year, month, day].join('-');
  }

я перепробовал все вышеперечисленные вопросы, но не работал для меня

Вы можете попробовать это, если для вас подойдет любой другой ответ.

Спасибо

Ответ 15

Приведенные ответы уже в порядке...

Тем не менее, официальная документация предлагает более краткое решение:

Сначала установите день, когда вы хотите быть нижней границей

 var today = new Date().toISOString().slice(0,10);

Затем включите диапазон с помощью validRange. Просто опустите дату end.

 validRange: {
    start: today
 },
 select: function(info) {
    //do stuff
 }