Flatpickr: Отправить форму OnChange дата
Я пытаюсь использовать OnChange для отправки выбранной даты в мою форму, чтобы перезагрузить мою страницу с выбранной датой в параметре URL, но я не могу найти, как это сделать.
Ранее я использовал jQuery datepicker, и это было довольно просто.
<form id="form" method="GET">
<input type="text" id="basicDate" placeholder="Please select Date Time" data-input>
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.2.3/flatpickr.js"></script>
<script>
$("#basicDate").flatpickr({
enableTime: false,
dateFormat: "Y-m-d",
});
</script>
ранее, с помощью выбора даты jQuery:
<form method='POST' enctype='multipart/form-data' id='formId'>
<input type="text" id="datepicker"/>
</form>
$(document).ready(function() {
$('#datepicker').datepicker({
onSelect : function (dateText, inst) {
$('#formId').submit(); // <-- SUBMIT
}});
});
1 ответ
Решение
Вы можете отправить форму, когда ввод был изменен, а также проверить, что ввод не пустой. Вот код для этого:
<form id="form" method="GET">
<input type="text" id="basicDate" placeholder="Please select Date Time" data-input>
</form>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.5.1/flatpickr.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.2.3/flatpickr.js"></script>
<script>
$(document).ready(function(){
$("#basicDate").flatpickr({
enableTime: false,
dateFormat: "Y-m-d",
});
});
$(document).on('change','#basicDate',function(){
if($('#basicDate').val() != ''){
$('#form').submit();
}
});