2010-10-14 54 views
2

我有一个日期选择器,只有一些日期基于3组数组。onSelect我检索我点击的可用日期。 现在事情变得复杂了。具有可用日期的数组需要是ID和日期为“key”和“value”的关联数组。如何检索与我点击的可用日期相关的ID?如何获得关联数组中的键和值

这里是我到目前为止的代码:

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; 
     }); 
    }); 
} 

回答

0

尝试是这样的(demo):

此脚本创建从关联数组(对象)日期的数组。切换键值对是比较容易的,因此日期是关键,值是ID,但我认为它可以实现这个想法。

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; 
     }); 
    }); 
} 
相关问题