无法在pikaday日历中设置日历开始日期

时间:2018-01-24 05:40:36

标签: javascript calendar pikaday

当我触发开始日期输入框时,我想在日历弹出窗口中显示未来或过去一个月作为结束日期日历中的开始日期。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="https://dbushell.com/Pikaday/css/pikaday.css">
    <link rel="stylesheet" href="https://dbushell.com/Pikaday/css/site.css">
</head>
<body>
    <input type="text" id="datepicker">
    <br/>
    <input type="text" id="datepicker2">
    <script src="https://cdn.jsdelivr.net/momentjs/2.14.1/moment-with-locales.min.js">    </script>
    <script src="https://dbushell.com/Pikaday/pikaday.js">    </script>
    <script>
    var picker = new Pikaday({
        field: document.getElementById('datepicker'),
        format: 'D MMM YYYY',
        minDate: new Date(),
        onSelect: function (date) {
            picker2.setMinDate(date);
            //picker2.???? to set the starting month of picker2 calendar
        }
    });
    var picker2 = new Pikaday({
        field: document.getElementById('datepicker2'),
        format: 'D MMM YYYY',
        minDate: new Date(),
        onSelect: function () {
            console.log(this.getMoment().format('Do MMMM YYYY'));
        }
    });
    </script>
</body>
</html>

请检查以上示例,根据开始日期选择我想触发结束日期日历开始月份。请建议。

JS bin link

2 个答案:

答案 0 :(得分:2)

根据我的理解,您希望将picker中的所选月份设置为picker2对象。使用API​​ onOpen

示例

var picker = new Pikaday({
    field: document.getElementById('datepicker'),
    format: 'D MMM YYYY',
    minDate: new Date(),
    onSelect: function(date) {
        //console.log(this.getMoment().format('Do MMMM YYYY'));
        console.log('test ' + date);
        picker2.setMinDate(date);
        //picker2.setStartRange(date)
    }
});

var picker2 = new Pikaday({
    field: document.getElementById('datepicker2'),
    format: 'D MMM YYYY',
    minDate: new Date(),
    onOpen: function() {
        picker2.gotoDate(picker.getDate())
    },
    onSelect: function() {
        console.log(this.getMoment().format('Do MMMM YYYY'));
    }
});

答案 1 :(得分:0)

当我在Vue.Js项目中使用Pikaday程序包时,必须在表单的日期字段中设置默认日期。我尝试了许多不同的版本来设置默认日期。但是他们没有为我工作。最终,我找到了适合自己情况的解决方案。解决方案是在此处设置 String url = "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4"; DownloadManager downloadManager = (DownloadManager)getSystemService(DOWNLOAD_SERVICE); DownloadManager.Request request = new DownloadManager.Request(Uri.parse(url)); request.setTitle("title"); request.setDescription("Your file is downloading"); request.setNotificationVisibility(DownloadManager.Request.VISIBILITY_VISIBLE_NOTIFY_COMPLETED); request.setDestinationInExternalPublicDir(Environment.DIRECTORY_MUSIC, "" + System.currentTimeMillis()); request.allowScanningByMediaScanner(); request.setAllowedOverMetered(true); request.setAllowedOverRoaming(true); //Enqueue download and save the referenceId long downloadReference = downloadManager.enqueue(request); if (downloadReference != 0) { Toast.makeText(getApplicationContext(), "download started", Toast.LENGTH_SHORT).show(); }else { Toast.makeText(getApplicationContext(), "no download started", Toast.LENGTH_SHORT).show(); } 之类的道具,auto-default="autoDefault"等于autoDefault这样的Pikaday组件...

true