Help changing a select form field depending on calendar date
I have a jquery calendar here http://offline.raileisure.com/
I am trying to get the duration select box to change its values depending on what day is selected..
Now the c开发者_开发技巧alendar only lets you choose Monday's or Fridays..
I need the select box to only show the following options..
When Monday (5 Days) When Friday (3 Days, 7 Days, 14 Days)
I don't know where to start :-(
Thanks
Lee
You could do this that way :
$("#datepicker").datepicker({
onSelect: function(e) {
var date = new Date(e);
var day = date.getDay(); // 0 = sunday etc...
// clean all the options
$("#duration").empty();
// if monday
if (day === 1) {
// add "5 days" options
$("#duration").append("<option value='5'>5 days</option>");
// else if friday
} else if (day === 5) {
// add 3 / 7 / 14 days options
$("#duration").append("<option value='3'>3 days</option>"
+ "<option value='7'>7 days</option>"
+ "<option value='14'>14 days</option>");
} else { // else...
}
}
});
When the user picks a date, if fills the <select>
according to the selected day.
jsFiddle example here
0Oki
You can fire a function on select of a day. When initializing the datepicker do this:
.datepicker({
onSelect: function(dateText, inst) {
var aDate = dateText.split("/");
var date = new Date(aDate[2], aDate[1] - 1, aDate[0]); //The - 1 is because the month is zero based.
alert(date.getDay());
}
});
You can parse the dataText variable and find out if its a monday or friday ... than populate the drop down accordingly :)
Source : http://jqueryui.com/demos/datepicker/#event-onSelect
HTH :)
精彩评论