Develop Reference

datepicker disable futures dates

I would like to disable future dates (starting with the day after tomorrow) using datapicker, but it's not working. I tried 3 solutions:
maxDate: 0
and
maxDate: '0'
and
maxDate: new Date();
All of them not working. Does anyone have any idea why not? Here is my code:
$('#datepicker').datepicker({
format: "dd-mm-yyyy",
maxDate: 0
});

With jQuery 3.3.1 and jQuery UI 1.12.1, this works fine:
<p>Date: <input type="text" id="datepicker"></p>
$('#datepicker').datepicker({
maxDate: new Date()
});
JS Fiddle demo

I'm assuming you're using bootstrap-datepicker. If that's the case, you should be using endDate, not maxDate.
If you're using another script, would be helpful adding this info to your question.

If you are using jQuery UI, consider this:
http://api.jqueryui.com/datepicker/#option-maxDate
The maximum selectable date. When set to null, there is no maximum.
Multiple types supported:
Date: A date object containing the maximum date.
Number: A number of days from today. For example 2 represents two days from today and -1 represents yesterday.
String: A string in the format defined by the dateFormat option, or a relative date. Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.
I would try the following:
$(function() {
$('#datepicker').datepicker({
format: "dd-mm-yyyy",
maxDate: 2
});
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.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>
<p>Date: <input type="text" id="datepicker"></p>

Datepicker for birthday textfield

I created a datepicker on my form that has Birthday label on it and textbox,
Now my problem is, Is there a way to prevent the user pick the current
date today, for example the user can't choose today's date, tommorow or yesterday as his birthday. hope you can help me, Thanks :)
here is my sample code:
<link href="https://cdn.jsdelivr.net/npm/gijgo#1.9.6/css/gijgo.min.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/gijgo#1.9.6/js/gijgo.min.js" type="text/javascript"></script>
<div class="md-form">
<input type="text" id="datepicker1" class="form-control " placeholder="Birthday" style="margin-top:-30px" name="date1" required>
</div>
here is my sample javascript:
<script>
$('#datepicker1').datepicker({
showOtherMonths: true
});
</script>
i know this is not enough script, im beginner at javascript and jquery but hope you can help me.Im using Bootstrap jQuery DatePicker material design

The jQuery datepicker has a maxDate option that you can set.
If you pass it a number, that will set the maximum date to that number of days from today.
Can't choose today, nor any dates after:
$('#datepicker1').datepicker({
showOtherMonths: true,
maxDate: -1 //The maximum date is 1 day ago
});
Can't choose yesterday, nor any dates after:
$('#datepicker1').datepicker({
showOtherMonths: true,
maxDate: -2 //The maximum date is 2 days ago
});
Can't choose any dates within the past year, nor any dates after:
$('#datepicker1').datepicker({
showOtherMonths: true,
maxDate: '-1y' //The maximum date is 1 year ago
});

You can use maxDate for this purpose like:
maxDate: '-2d' // here d is the no of days ago, you can pass any no of days that you want to restrict
Ex:
$(function() {
$( "#datepicker" ).datepicker({
dateFormat: "dd/mm/yy",
maxDate: '-2d'
});
});
Working Fiddle

Use this in your javascript
$('.datepicker').datepicker({
format: 'mm/dd/yyyy',
startDate: '-3d'
});
use startDate to change values according to your need and here -3 means 3 days before and 'd' basically represents day
startDate: '-3d'

Passing value from JQuery Datepicker to code behind

I am using JQuery Datepicker in my .aspx file.
I need to use the date value in my code behind file. This is my function which I want to update a hidden value on my page which I can use in my code behind.
$(function () {
$("#datepicker").datepicker({ minDate: 0,
onSelect: function () {
var dueDate= document.getElementById('dueDate');
dueDate.value = $(this).datepicker('getDate');
}
});
});
My hidden value which I want to update, which is on the same .aspx page:
<Input id="dueDate" type="hidden" runat="server" />
Now in my code behind, I want to use the date like so:
DateTime due= dueDate.Value;
This gives me an error:
Cannot implicitly convert type 'string' to 'System.DateTime'
I get the same error when I use
DateTime due = Convert.ToDateTime(dueDate.Value);
What is the correct way to use the date from Datepicker in the code behind?

DateTime.Parse(...)
or
DateTime.ParseExact(...)
or
DateTime.Parse("01/01 2010");
or use
DateTime.TryParse
if you aren't sure it converts in which type every time, ie. not always a date, so try this 4 and check

Consider having the following code on your .aspx file, removing runat server:
<input type="hidden" id="dueDate" name="dueDate" value="" />
Now make the following change in your jquery datepicker function:
$(function () {
$("#datepicker").datepicker({
minDate: 0,
dateFormat: "dd-mm-yyyy",
onSelect: function() {
$("#dueDate").val() = $(this).datepicker("getDate");
}
});
}
This way the hidden field value of dueDate gets updated whenever the value of your datepicker control is changed. Further since your hidden field now has a name and value attribute associated with it, your code behind would receive its value as a string whenever your form is posted.
Now in your code behind file, create your DateTime object as follows:
string[] dueDateSplit = Request.Form["dueDate"].Split('-');
DateTime due = new DateTime(dueDateSplit[2], dueDateSplit[1], dueDateSplit[0]);

Provide a name for the datepicker
<Input id="dueDate" name = "dueDate" type="hidden" runat="server" />
and use the below
String text = Page.Request.Form["dueDate"]

PHP + jQuery: Apply datepicker to inputs with specific pattern

I have a big form with at least 5 input date forms.
For example:
<input type="text" id="nameClient" name="nameClient"/>
<input type="text" id="nameRouterID" name="nameRouerID"/>
<input type="text" id="dateInstallation" name="dateInstallation"/>
<input type="text" id="dateConfiguration" name="dateConfiguration"/>
<input type="text" id="dateConfirmationClient" name="dateConfirmationClient"/>
Well, i want to search the entire DOM for %date% word and apply datepicker jQuery plugin, avoiding to create this following lines for each element
<script>
$( "#dateInstallation" ).datepicker();
$("#dateInstallation").datepicker("option", {dateFormat: "dd/mm/yy", changeMonth: true, changeYear: true});
});
</script>';
I think it's possible to know with .find() function and "this" relative, but i'm not familiar. I think is something like this:
$( "text" ).find( "%date%" ).datepicker();
And later:
$(this).datepicker("option", {dateFormat: "dd/mm/yy", changeMonth: true, changeYear: true});
But i can't get it work I am not sure whether it is syntax problem or other

You can use the attribute starts with selector to match ID's starting with date
$('[id^="date"]').datepicker();
or to match any ID containing date, the attribute contains selector
$('[id*="date"]').datepicker();
FIDDLE

I need javascript to automatically prefix+suffix as it populates a field? I want it to be surrounded with apostrophes?

div with-altfield is a multidatepicker. Upon selection of a date it populates the altfield input. In format, mm/dd/yy,mm/dd/yy,.. I want it to actually populate the input with apostrophes surrounding the date selected. Like, 'mm/dd/yy','mm/dd/yy',... this is my code.
<script type="text/javascript">
$(function() {
$('#with-altField').multiDatesPicker({
altField: '#altField',
});;
});
</script>
</head>
<body>
<div id="with-altField"></div>
<input type="text" id="altField">
</body>
Please help!
Thank you
Si

Just use the dateFormat option. The syntax is explained here.
$('#with-altField').multiDatesPicker({
altField: '#altField',
dateFormat: "''mm/dd/yy''"
});