Restrict future date in Calendar

Dinesh Santhalingam

9y1.8k.NET

http://www.aspsnippets.com/demos/216/

I am using the Calendar Plugin from the above website .I want to restrict the Selection of future date .I don't know how to do this?Help me..

14 Replies

Know the answer? Post it — somebody with the same question will find it here.

Rathrola Prem Kumar9y ago

The datepicker has the maxdate property that you can set when you initialize it.

$("#datepicker").datepicker({ maxDate: new Date, minDate: new Date(2007, 6, 12) });

Like my ans, if it helps u. Thanks :)

Mangesh G9y ago
Dinesh Santhalingam9y ago
1. <html>
2. <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript">script>
3. <script src="Scripts/jquery.dynDateTime.min.js" type="text/javascript">script>
4. <script src="Scripts/calendar-en.min.js" type="text/javascript">script>
5. <link href="Styles/calendar-blue.css" rel="stylesheet" type="text/css" />
6. <script type="text/javascript">
7. $(document).ready(function () {
8. $("#<%=TextBox1.ClientID %>").dynDateTime({
9. showsTime: false,
10. ifFormat: "%d/%m/%y ",
11. daFormat: "%l;%M %p, %e %m, %Y",
12. align: "BR",
13. electric: false,
14. singleClick: false,
15. displayArea: ".siblings('.dtcDisplayArea')",
16. button: ".next()"
17. });
18. });
19. script>
20. <body>
21. <form id="form1" runat="server">
22. <asp:TextBox ID="TextBox1" runat="server" >asp:TextBox>
23. <img src="calender.png" />
24. form>
25. body>
26. html>
Here is my code @
Mangesh Gaherwar

Mangesh G9y ago

Share Complete ASPX Page if Possible Dinesh

Dinesh Santhalingam9y ago

No errors were Populated.Actually I Include that max date to my coding,but it is not affect my code.

link:http://www.aspsnippets.com/Articles/jQuery-UI-DatePicker-Calendar-Example-in-ASPNet.aspx

Mangesh G9y ago

Dinesh

try CTRL+SHIFT+J an see the errors at the console

an post here

Dinesh Santhalingam9y ago

I tried this but not working, @Mangesh Gaherwar

Mangesh G9y ago

$(document).ready(function () {
var maxdate = new Date();
$("#<%=txtDate.ClientID %>").datepicker({
showsTime: false,
ifFormat: "%d/%m/%y ",
daFormat: "%l;%M %p, %e %m, %Y",
align: "BR",
electric: false,
maxDate: maxdate,
singleClick: false,
displayArea: ".siblings('.dtcDisplayArea')",
button: ".next()"
});

Dinesh Santhalingam9y ago

$(document).ready(function () {
var maxdate = new Date();
$("#<%=TextBox1.ClientID %>").dynDateTime({
showsTime: false,
ifFormat: "%d/%m/%y ",
daFormat: "%l;%M %p, %e %m, %Y",
align: "BR",
electric: false,
maxDate: maxdate,
singleClick: false,
displayArea: ".siblings('.dtcDisplayArea')",
button: ".next()"
});
});

This my Current code from http://www.aspsnippets.com/demos/216/

Mangesh G9y ago

Share your working code Dinesh Lemme see share aspx

Dinesh Santhalingam9y ago

It not works @ Mangesh Gaherwar.

Mangesh G9y ago

Just add this In ur script Dinesh

$(function () {
var maxdate = new Date();
$("[id$=txtDate]").datepicker({
maxDate: maxdate,
showOn: 'button',
buttonImageOnly: true,
buttonImage: 'http://jqueryui.com/demos/datepicker/images/calendar.gif'
});

});

Hope it Helps U

Mark approved if it does

Reference

http://api.jqueryui.com/datepicker/#option-maxDate

Rajeesh Menoth9y ago

Hi,

Try this code:

var date = new Date("2013-07-15");
var currentMonth = date.getMonth();
var currentDate = date.getDate();
var currentYear = date.getFullYear();
$("#datepicker" ).datepicker( "option", "maxDate", new Date(currentYear, currentMonth, currentDate));

Demo :

http://jsfiddle.net/yLjDH/38/

Salman Beg9y ago

Hi.

You can do like this,

 $(function() {   $( "#datepicker" ).datepicker({  maxDate: new Date() }); });

Or you can achieve this using as below:

$(function() {   $( "#datepicker" ).datepicker({  maxDate: 0 }); });

thanks.