I have a datepicker which has only some dates enabled based on 3 sets of arrays. onSelect I retrieve the available date I clicked. Now things get complicated. The array with the available dates needs to be an associative array with id and date as 'key' and 'value'. How do I retrieve the id associated with the available date I clicked on?
Here's my code so far:
function calendar(){
function datePicker(array){
$j("#datepicker").datepicker({
dateFormat: 'dd-mm-yy',
minDate: $j.datepicker.parseDate('ddmmyy', array[0]), //this makes the datepicker start at the first available
beforeShowDay: function(dateToShow){
if ($j.inArray($j.datepicker.formatDate('ddmmyy', dateToShow),array) !== -1) return [1, 'my-class', 'Available date!'];
else return [0, 'no-class', 'Date not available!'];
},
//get the selected date
onSelect: function(dateText) {
var dateAsString = dateText; //the first parameter of this function
//var dateAsObject = $j(this).datepicker( 'getDate' ); //the getDate method
$j('#getDate').text(dateAsString);
}
});
}
$j('.book-pack a.button').each(function(){
//getting the button id
var btnId = $j(this).attr('id');
//arrays with available dates for the 3 packs
var datesClub = new Array('08102010', '09102010', '15102010', '16102010', '22102010', '23102010', '29102010', '30102010');
var datesEssential = new Array('08102010', '09102010', '15102010', '16102010', '22102010', '23102010', '29102010', '30102010');
var datesFling = new Array('08102010', '09102010', '15102010', '16102010', '22102010', '23102010', '29102010', '30102010');
$j(this).click(function(){
switch(btnId)
{
case 'club-class':
$j('.window h2.page-title').text('Club Class');
datePicker(datesClub);
break;
case 'essential':
$j('.window h2.page-title').text('The Essential Experience');
datePicker(datesEssential);
break;
case 'last-fling':
$j('.window h2.page-title').text('Last Fling Before the Ring');
datePicker(datesFling);
break;
}
开发者_如何转开发 return false;
});
});
}
Try something like this (demo):
This script creates an array of dates from the associative array (object). It was easier to switch the key: value pairs so that the date was the key and the value was the id, but I think it gets the idea across.
function calendar() {
function datePicker(pack) {
// create array of dates from pack
var i, array = [];
for (var i in pack) {
array.push(i);
}
$j("#datepicker").datepicker({
dateFormat: 'dd-mm-yy',
minDate: $j.datepicker.parseDate('ddmmyy', array[0]),
//this makes the datepicker start at the first available
beforeShowDay: function(dateToShow) {
return ($j.inArray($j.datepicker.formatDate('ddmmyy', dateToShow), array) !== -1) ? [1, 'my-class', 'Available date!'] : [0, 'no-class', 'Date not available!'];
},
//get the selected date
onSelect: function(dateText, inst) {
var dateAsString = dateText,
//the first parameter of this function
dateCompressed = (dateText).replace(/-/g, ''); // dd-mm-yyyy -> ddmmyyyy
$j('#getDate').text(dateAsString);
$j('#getId').text(pack[dateCompressed]);
}
});
}
$j('.book-pack a.button').each(function() {
//getting the button id
var btnId = $j(this).attr('id');
//arrays with available dates for the 3 packs
var datesClub = { '08102010' : 'id1', '09102010' : 'id2', '15102010' : 'id3', '16102010' : 'id4', '22102010' : 'id5', '23102010' : 'id6', '29102010' : 'id7', '30102010' : 'id8' };
var datesEssential = { '08102010' : 'id1', '09102010' : 'id2', '15102010' : 'id3', '16102010' : 'id4', '22102010' : 'id5', '23102010' : 'id6', '29102010' : 'id7', '30102010' : 'id8' };
var datesFling = { '08102010' : 'id1', '09102010' : 'id2', '15102010' : 'id3', '16102010' : 'id4', '22102010' : 'id5', '23102010' : 'id6', '29102010' : 'id7', '30102010' : 'id8' };
$j(this).click(function() {
switch (btnId) {
case 'club-class':
$j('.window h2.page-title').text('Club Class');
datePicker(datesClub);
break;
case 'essential':
$j('.window h2.page-title').text('The Essential Experience');
datePicker(datesEssential);
break;
case 'last-fling':
$j('.window h2.page-title').text('Last Fling Before the Ring');
datePicker(datesFling);
break;
}
return false;
});
});
}
精彩评论