In this example we will see how to disable the previous date selection in JQuery UI date picker. To disable the previous dates we need to set the minDate property of date picker. if we set minDate:0 then it will disable all the previous dates.
Step 1:
The first step is to copy and paste the java script code and jquery links into the header.
<link href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" rel="stylesheet"></link>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<script>
$(function () {
$("#datepicker").datepicker({ minDate: 0 });
});
</script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<script>
$(function () {
$("#datepicker").datepicker({ minDate: 0 });
});
</script>
Step 2:
Add bellow code within body tag or where you want to place
<p>Date: <input type="text" id="datepicker" /></p>
DEMO
Date:
how to disable specific date if is taken (from database )
ReplyDeleteYou actually make it seem so easy with your presentation but I find this matter to be actually something that I think I would never understand. It seems too complex and extremely broad for me. I am looking forward for your next post, I will try to get the hang of it!
ReplyDelete