简体   繁体   English

如何在日期选择器实体中添加事件日期?

[英]How to add an event date in Date Picker Materialize?

I'm trying to add event's date in the calendar of the day picker using the method that Materialize suggest but isn't working for me or maybe I'm doing something wrong. 我正在尝试使用Materialize建议的方法在日期选择器的日历中添加事件的日期,但这对我不起作用或者我做错了。

Materialize Date Picker 实现日期选择器

var elems = document.querySelector('.datepicker')
var instances = M.Datepicker.init(elems, {
      events: [new Date('2018,12,12').toLocaleDateString()]
    }

EDIT- 编辑-

Solution to my Problem- 解决我的问题 -

Down below is the code of my final working result, by the way I used this date format ('2018,12,12') because it is easier for me to figure that 12 is equals to december rather than 11 in this date format (2018,11,25) . 下面是我最终工作结果的代码,按照我使用这种日期格式('2018,12,12')的方式,因为我更容易确定12在这个日期格式中等于12月而不是11( 2018,11,25)。

I have also added other parameters which are working perfectly. 我还添加了其他完美的参数。

I appreciate your help, Thanks Germa V. 感谢您的帮助,谢谢Germa V.

document.addEventListener('DOMContentLoaded', function() {

    let eventsDates = [
        new Date('2018,12,1').toDateString(),
        new Date('2018,12,2').toDateString()
    ];
    let disableListDate = [
        new Date('2018,12,3').toDateString(),
        new Date('2018,12,4').toDateString()
    ];

    let optionsDate = {
        defaultDate: defaultDate,
        setDefaultDate: true,
        firstDay: 1,
        events: eventsDates,
        disableWeekends: false,
        autoClose: false,
        showDaysInNextAndPreviousMonths: false,
        showClearBtn: true,
        i18n:{
            months: 
            ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agost', 'Sept', 'Oct', 'Noviem..', 'Diciemb..'],
            monthsShort: ['Ene', 'Feb', 'Mar', 'Abril', 'Mayo', 'Jun', 'Jul', 'Agos', 'Sep', 'Oct', 'Nov', 'Dic'],
            weekdays: ['Dom','Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'Sab']
        },
        format: 'dd-mmm-yyyy',
        onSelect() {
            if (optionsDate.events.includes(this.date.toDateString())) {
                alert('Event Date');
            }
        },

        disableDayFn(date) {
            if(disableListDate.includes(date.toDateString()))
                return true
            else
                return false
        },

        parse(){

        }
    }

    let elems = document.querySelector('.datepicker');
    let instances = M.Datepicker.init(elems, optionsDate);
});

That's not how you set a date in Date() , if you want to know how to set date in Datepicker function then you can check this answer --> How to set date in Materialize Datepicker 这不是你在Date()设置日期的方式,如果你想知道如何在Datepicker函数中设置日期,那么你可以检查这个答案 - > 如何在Materialize Datepicker中设置日期

var optionsDate = {
    events: [new Date(2018, 11, 20).toDateString(),
    new Date(2018, 11, 21).toDateString()],
    onSelect() {
        if (optionsDate.events.includes(this.date.toDateString())) {
            console.log('Event Date');
        }
    }
}
var elemsDate = document.querySelector(".datepicker");
var instanceDate = M.Datepicker.init(elemsDate, optionsDate);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM