如何制作月份下拉选择列表

我想弄清楚如何自定义FullCalenaer JavaScript事件日历(http://fullcalendar.io/)。 我想在我的日历上方添加一个选择列表(以月份格式显示),它将列出未来12个月和最近12个月的列表。 当用户做出选择时,它会跳到那个月份。 我认为它需要实现gotoDate函数(http://fullcalendar.io/docs/current_date/gotoDate/),但我有点困惑如何使用它。


“gotoDate”方法正是你想要使用的。 它接受一个参数作为字符串或“Moment”对象(http://momentjs.com/)。 Moment是Adam Shaw在FullCalendar中用来帮助他处理日期和时间的第三方库。 该字符串建议为ISO8601日期; 然而,FullCalendar或Moment也接受'MM / dd / yyyy'。 您创建Moment对象的方式如下:

var momObj = moment([your date string]);

如果您的选择框中的每个选项都有一个日期值(我建议每个月的第一个),那么您所要做的就是将FullCalendar传递给选定的值。

[your calendar].fullCalendar('gotoDate', [selected value]);

这会将您的日历发送到选定的日期。


迟到总比不到好。 我只是做了一个下拉列表并将其放在日历顶部。

<script type='text/javascript'>
$(function() {
    var getdate = $('#calendar').fullCalendar('getDate');
$("select.monthpicker").val(getdate.format('YYYY-MM'));
$('#monthsubmit').on('click', function () {
    var submit = $('select.monthpicker').val();
    $('#calendar').fullCalendar( 'gotoDate', submit );
});
});
function datechange()
{
   document.getElementById('monthsubmit').click();
}
</script>

下一部分使用mysql查询构建select。 你不应该使用一个查询,但在当时,这对我来说更容易,因为我有日历那里,如果我的mysql日历中没有日期,用户不应该能够在那里导航无论如何:

<div id="monthpicker">
<?php
include('connection_mysqli.php');
$result_month = mysqli_query($con,"
select distinct date_format(date,'%M %Y') as date,date_format(date,'%Y-%m') as value from calendar where date between curdate() - interval 1 month and curdate() + interval 5 month and day(date)=day(curdate())
");?>
<select class="monthpicker" onchange="datechange()">
<?php
while($row = $result_month->fetch_assoc())
        {   
        echo "<option value='".$row['value']."'>".$row['date']."</option>";
        };
?>
</select> <button id="monthsubmit" hidden>GO</button>
</div>
链接地址: http://www.djcxy.com/p/81279.html

上一篇: How to make a month dropdown select list

下一篇: How do I bind to list of checkbox values with AngularJS?