Today, We want to share with you how to disable previous date in bootstrap datepicker.In this post we will show you disable future dates in bootstrap datepicker, hear for bootstrap-datetimepicker disable past time we will give you demo and example for implement.In this post, we will learn about Bootstrap datepicker Disable Past Dates And Time with an example.
how to Disable Previous Date in Bootstrap Datepicker?
Solution:
$('.datepicker').datepicker({ startDate: new Date() });
index.html
Bootstrap Datepicker Disable Past Dates Example - www.pakainfo.com Bootstrap Datepicker Disable Past Dates Example - www.pakainfo.com
Current Date is 5/7/2020
Disable Previous Date in Bootstrap Datepicker
To disable previous dates in Bootstrap Datepicker, you can use the startDate option to set the earliest selectable date. Here is an example:
$(function() { // Initialize the datepicker $('#datepicker').datepicker({ startDate: new Date() // Set the earliest selectable date to today }); });
In this example, we use the startDate option to set the earliest selectable date to today. This means that the user will not be able to select any date before today.
You can also use the endDate option to set the latest selectable date. For example, to disable all dates after a specific date, you can set the endDate option to that date. Here is an example:
$(function() { // Initialize the datepicker $('#datepicker').datepicker({ endDate: '2023-12-31' // Set the latest selectable date to December 31, 2023 }); });
In this example, we use the endDate option to set the latest selectable date to December 31, 2023. This means that the user will not be able to select any date after December 31, 2023.
You can also use the setStartDate and setEndDate methods to set the start and end dates dynamically. For example, you can set the startDate to today and the endDate to one year from today using the following code:
$(function() { // Initialize the datepicker var datepicker = $('#datepicker').datepicker(); // Set the earliest selectable date to today datepicker.datepicker('setStartDate', new Date()); // Set the latest selectable date to one year from today var endDate = new Date(); endDate.setFullYear(endDate.getFullYear() + 1); datepicker.datepicker('setEndDate', endDate); });
In this example, we use the setStartDate and setEndDate methods to set the start and end dates dynamically. We first initialize the datepicker and then set the earliest selectable date to today using setStartDate. We then calculate the latest selectable date, which is one year from today, and set it using setEndDate.
I hope you get an idea about jquery datepicker | disable dates before today.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.