<html>
<head>
<title>how to enable and disable custom dates in datepicker using JQuery.</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"
type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/redmond/jquery-ui.css"
rel="Stylesheet" type="text/css" />
<script type="text/javascript">
$(function () {
var dateEnable;
$.ajax({
type: "POST",
url: "Default.aspx/DateEnableDisable",
data: '{}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
dateEnable= "[" + JSON.parse(data.d).map(x => x.Date).join(',') + "]"
$('#txtdateenable').datepicker({
beforeShowDay: function (date) {
var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
console.log(string);
return [dateEnable.indexOf(string) == -1]
}
});
}
});
});
</script>
</head>
<body>
<form id="form1">
<div>
<input type="text" id="txtdateenable" name="name" value=" " />
</div>
</form>
</body>
</html>