为Daterangepicker设置每年的最小值最大值

Question

Although i have found some general answers to my question, i couldn't find any which solves my specific problem.

I have developed a backend for some users, where they can view/edit the availability of their hotel rooms for the whole selected year. I am using HTML/PHP/MySQL to display the availability values of the year they want. There are 365 inputs in this form (each input represents a single day. That means that there are 365 inputs, depending on the selected year). Then i use the daterangepicker jQuery plugin, so he can selecte date ranges and change the availability values. They can only view/edit availabilities for the current and the next year.

I let them switch from current year to next year and backwards with this code:

<a class="btn btn-primary" href="https://domain.com/backend/availability/edit_availability/11/0">2016</a>
<a class="btn btn-default" href="https://domain.com/backend/availability/edit_availability/11/1">2017</a>

For the record, i check the last href parameter to understand the selected year. Current year is /0 and next year is /1. I want to display only current and next year.

With the below code they select a date range, set the availability number and 'Fill' the calendar with the given availability number:

<input id="availability_dates" class="form-control" type="text" required="required" value="" name="availability_dates">
<input id="availability_number" class="form-control col-md-7 col-xs-12" type="text" name="availability_number">
<button id="fill-availabilities" class="btn btn-success" type="submit">Fill</button>

<script>
$('#availability_dates').daterangepicker(
 {
    format: 'DD/MM/YYYY'
 }, function (start, end, label) {
    console.log(start.toISOString(), end.toISOString(), label);
 });
</script>

I grab his desired year like this:

<?php
if ($year == '0') {
   $display_year = date('Y');
   $other_year = date('Y', strtotime('+1 year'));
} else {
   $display_year = date('Y', strtotime('+1 year'));
   $other_year = date('Y');
}
?>

Anyway, that's a sort briefing. What i am trying to do is, set the minimum and maximum dates to the daterangepicker just for the selected year . If they view 2016, i want to limit the daterangepicker to 1st of January - 31st December of 2016 only. Same for the next year 2017 and so on.

As you can see, years are grabbed dynamically, so i need a "script" where the daterangepicker will work even if we are in 2018 or 2020 etc.

I'm sorry for the long post, i've tried to explain a lot more than needed in case someone has a better solution/idea.

Thank you in advance

Answer 1

I personally would recommend you using some sort of library for that. Usually is a mess to manually do that (in my personal experience) and the libraries available are usually quite good.