I have jquery datepicker and try make select data for count. When click on input I get datepicker calendar and same time alert from input with message 1,aprill,21. If I chose date from datepicker I not get result from my function. If I chose message date I get NaN. So it is mean my datepicker select does not work. How I can fix it. Very tired with this plagin My HTML
<input type="text" class="form-control datepicker error-place" name="datepicker" id="datepicker" placeholder="27/04/2021" required data-error="#datepicker">
var datepicker = $("#datepicker").datepicker({
closeText: "Đóng",
prevText: "Trước",
nextText: "Sau",
currentText: "Hôm nay",
monthNames: ["Tháng một", "Tháng hai", "Tháng ba", "Tháng tư", "Tháng năm", "Tháng sáu", "Tháng bảy", "Tháng tám", "Tháng chín", "Tháng mười", "Tháng mười một", "Tháng mười hai"],
monthNamesShort: ["Một", "Hai", "Ba", "Bốn", "Năm", "Sáu", "Bảy", "Tám", "Chín", "Mười", "Mười một", "Mười hai"],
dayNames: ["Chủ nhật", "Thứ hai", "Thứ ba", "Thứ tư", "Thứ năm", "Thứ sáu", "Thứ bảy"],
dayNamesShort: ["CN", "Hai", "Ba", "Tư", "Năm", "Sáu", "Bảy"],
dayNamesMin: ["CN", "T2", "T3", "T4", "T5", "T6", "T7"],
weekHeader: "Tuần",
dateFormat: "dd/mm/yy",
firstDay: 1,
isRTL: false,
showMonthAfterYear: false,
changeYear: true,
});
And function
function GetBirthDate() {
var flatpickr;
$("#datepicker").datepicker({
dateFormat: "yy-m-d",
changeMonth: true,
changeYear: true,
onSelect: function (dateText, inst) {
var dt = $.datepicker.parseDate("yy-m-d", dateText);
flatpickr = dt.getFullYear();
console.log("Birth Year: " + flatpickr);
}
});
};
It's not a problem with the callback or the datepicker. You are using the wrong date format for parsing the date. It should be 'dd/mm/yy' instead of 'yy-m-d'.
The code should look this, (look at the onSelect function):
var datepicker = $("#datepicker").datepicker({ closeText: "Đóng", prevText: "Trước", nextText: "Sau", currentText: "Hôm nay", monthNames: ["Tháng một", "Tháng hai", "Tháng ba", "Tháng tư", "Tháng năm", "Tháng sáu", "Tháng bảy", "Tháng tám", "Tháng chín", "Tháng mười", "Tháng mười một", "Tháng mười hai"], monthNamesShort: ["Một", "Hai", "Ba", "Bốn", "Năm", "Sáu", "Bảy", "Tám", "Chín", "Mười", "Mười một", "Mười hai"], dayNames: ["Chủ nhật", "Thứ hai", "Thứ ba", "Thứ tư", "Thứ năm", "Thứ sáu", "Thứ bảy"], dayNamesShort: ["CN", "Hai", "Ba", "Tư", "Năm", "Sáu", "Bảy"], dayNamesMin: ["CN", "T2", "T3", "T4", "T5", "T6", "T7"], weekHeader: "Tuần", dateFormat: "dd/mm/yy", firstDay: 1, isRTL: false, showMonthAfterYear: false, changeYear: true, onSelect: function(dateText, inst) { var dt = $.datepicker.parseDate("dd/mm/yy", dateText); console.log(dt); flatpickr = dt.getFullYear(); console.log("Birth Year: " + flatpickr); } });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <link rel="stylesheet" href="/resources/demos/style.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <input type="text" class="form-control datepicker error-place" name="datepicker" id="datepicker" placeholder="27/04/2021" required data-error="#datepicker">
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.