Второй DatePicker не может выбрать дату меньше, чем первый DatePicker - PullRequest
Новая
       7

Второй DatePicker не может выбрать дату меньше, чем первый DatePicker

0 голосов
/ 01 декабря 2018

В качестве заголовка я реализовал два datePicker в своем проекте, моя цель состоит в том, чтобы второй datePicker не мог выбрать дату раньше даты, выбранной в первом datePicker.

код: 

    <div class="col-md-4">
    <form name="NOME_FORM" method="post" action="registra_campagne.php" class="text-center border border-light p-5" onsubmit="return validateForm()">
    <p class="h4 mb-4">Durata Campagna</p>
    <div class="md-form">
    <!--The "from" Date Picker -->
    <input name="data_inizio" placeholder="Data inizio" type="text" id="date-picker-example" class="form-control datepicker">
    <label for="date-picker-example">Inizio</label>

    </div>
    <div class="md-form">
    <!--The "to" Date Picker -->
    <input name="data_fine" placeholder="Data Fine" type="text" id="date-picker-example2" class="form-control datepicker">
    <label for="date-picker-example2">Fine</label>
    </div>
    <input class="btn btn-info btn-block" name="submit" type="submit" value="Aggiungi"><br>
    </form>
    </div>
    <script type="text/javascript">




    // Data Picker Initialization
    $('.datepicker').pickadate({
    min : new Date(),
    onClose: function(){
    $('#date-picker-example2').pickadate({
    min : $('.datepicker').val()
    })
    }
    });


    $('.datepicker').pickadate({
    // Escape any “rule” characters with an exclamation mark (!).
    format: 'yyyy/mm/dd',
    formatSubmit: 'Y/m/d',
    hiddenPrefix: 'prefix__',
    hiddenSuffix: '__suffix'
    })


    $('.datepicker').pickadate({
    closeOnSelect: false,
    closeOnClear: false

    });
    $('#input_starttime').pickatime({
    twelvehour: true

    });
    $('#input_endtime').pickatime({
    darktheme: true,
    twelvehour: false

    });
    </script>

Я был бы очень признателен, потому что до сих пор единственная реализованная функция состоит в том, что пользователь, который использует datePicker, не может выбрать дату до текущей даты

1 Ответ

0 голосов
/ 01 декабря 2018

У меня было неудовольствие, чтобы просмотреть документацию для выбора даты.Это не очень легко понять, но само средство выбора даты хорошо сделано, все еще лучше любой нативной альтернативы.

Его - то, что вам нужно установить, и некоторые дополнительные советы: 

$("#date2").datepicker({ // initialization, you pass an option object to the datepicker function
changeMonth: true,          // with this you can change months on click

changeYear: true,            //  change year on click

yearRange: "1930:2018",       // your year range , this is what you need
showAnim: "slide",            // give the datpicker calendary UI an animation
onSelect: calcDiff,           // here you can pass you own callback functions, this is mine, you do not need this
onClose: move,                 // another of my own

minDate: null,                 // do not set this if you want to limit the range
maxDate: null                   // do not set this
});

Всевам нужно указать yearRange: «1930: 2018» в объекте параметров.

Вы можете проверить это, верхний - экземпляр DatePicker, нижний - очень плохая реализация HTML / JS

https://codepen.io/damPop/pen/oayEdg?editors=0010

Хорошо, вот еще один, более короткий кодовый блок:

https://codepen.io/damPop/pen/vQbprR?editors=1010

В строке 8 вы задаете диапазон для первого экземпляра DatePicker, yearRange: "1990: 2010 ".

В строке 28 вы делаете то же самое для второго элемента ввода yearRange:" 1991: 2010 "

...