RadhaKrishnaKiJaya
asked on
Change the color of the selected dates ASP.Net VB.Net
Hi Experts,
I have a date picker control. I have three categories of dates.
1. Menu Available - If menu available for that date then change its color. Which I can do right now.
2. Customer Order available - If Customer order available then change its color to a different color(This web method has a CustID parameter).
3. If the date is a holiday, then disable it.
Thanks in advance.
I have a date picker control. I have three categories of dates.
1. Menu Available - If menu available for that date then change its color. Which I can do right now.
2. Customer Order available - If Customer order available then change its color to a different color(This web method has a CustID parameter).
3. If the date is a holiday, then disable it.
Thanks in advance.
ASKER
<link href="/js/smoothness/jquer y-ui.css" rel="stylesheet" />
<script src="/js/jquery-1.10.2.js" ></script>
<script src="/js/jquery-ui.js"></s cript>
<script type="text/javascript">
var reserveddates;
var weekenddate;
function DisableSpecificDatesWeeken ds(date) {
var day = date.getDate(),
month = date.getMonth() + 1,
year = date.getFullYear();
if (month.toString().length < 2) month = '0' + month;
if (day.toString().length < 2) day = '0' + day;
var currentdate = [year, month, day].join('-');
if (jQuery.inArray(currentdat e, reserveddates) !== -1) {
return [true, "Highlighted", ""];
} else if (date.getDay() === 0 || date.getDay() === 6) {
return [false, "disabled_week"]
}
else {
return [true, "", ""];
}
}
function ChangeColorSpecificDates(d ate) {
var day = date.getDate(),
month = date.getMonth() + 1,
year = date.getFullYear();
if (month.toString().length < 2) month = '0' + month;
if (day.toString().length < 2) day = '0' + day;
var currentdate = [year, month, day].join('-');
if (jQuery.inArray(currentdat e, reserveddates) !== -1) {
return [true, "Highlighted", ""];
}
else {
return [true, "", ""];
}
}
$(function () {
reserveddates = []
$.ajax({
type: "POST",
url: "Menu.aspx/Get_Menu_Dates" ,
data: '{}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var xml = $.parseXML(response.d);
var dates = $(xml).find('MenuDate');
$.each(dates, function () {
reserveddates.push($(this) [0].textCo ntent.spli t('T')[0]) ;
});
$("input[id$='txtSelectedD ate']").da tepicker({
showOn: "button",
buttonImage: "images/Calender.png",
buttonImageOnly: true,
beforeShowDay: ChangeColorSpecificDates
});
}
});
$("input[id$='chkWeekend'] ").change( function () {
if ($("input[id$='chkWeekend' ]").is(':c hecked')) {
$("input[id$='txtSelectedD ate']").da tepicker(' option', { beforeShowDay: DisableSpecificDatesWeeken ds })
}
else {
$("input[id$='txtSelectedD ate']").da tepicker(' option', { beforeShowDay: ChangeColorSpecificDates })
}
})
});
</script>
<script src="/js/jquery-1.10.2.js"
<script src="/js/jquery-ui.js"></s
<script type="text/javascript">
var reserveddates;
var weekenddate;
function DisableSpecificDatesWeeken
var day = date.getDate(),
month = date.getMonth() + 1,
year = date.getFullYear();
if (month.toString().length < 2) month = '0' + month;
if (day.toString().length < 2) day = '0' + day;
var currentdate = [year, month, day].join('-');
if (jQuery.inArray(currentdat
return [true, "Highlighted", ""];
} else if (date.getDay() === 0 || date.getDay() === 6) {
return [false, "disabled_week"]
}
else {
return [true, "", ""];
}
}
function ChangeColorSpecificDates(d
var day = date.getDate(),
month = date.getMonth() + 1,
year = date.getFullYear();
if (month.toString().length < 2) month = '0' + month;
if (day.toString().length < 2) day = '0' + day;
var currentdate = [year, month, day].join('-');
if (jQuery.inArray(currentdat
return [true, "Highlighted", ""];
}
else {
return [true, "", ""];
}
}
$(function () {
reserveddates = []
$.ajax({
type: "POST",
url: "Menu.aspx/Get_Menu_Dates"
data: '{}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var xml = $.parseXML(response.d);
var dates = $(xml).find('MenuDate');
$.each(dates, function () {
reserveddates.push($(this)
});
$("input[id$='txtSelectedD
showOn: "button",
buttonImage: "images/Calender.png",
buttonImageOnly: true,
beforeShowDay: ChangeColorSpecificDates
});
}
});
$("input[id$='chkWeekend']
if ($("input[id$='chkWeekend'
$("input[id$='txtSelectedD
}
else {
$("input[id$='txtSelectedD
}
})
});
</script>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks a lot. It Worked. Please ignore the previous msg I sent to you.
ASKER
Thank you so much.
You are welcome RadhaKrishna
what "date picker" are you using?