2012-12-21 4 views
1

Je travaille sur le sélecteur de date basé sur Twitter Bootstrap qui utilise un datpicker de https://github.com/eternicode/bootstrap-datepicker.étendre bootstrap datepicker fonction intelligemment

Je voulais étendre faire quelque chose comme ce qui permet aux utilisateurs de sélectionner 2 dates et mettre à jour le calendrier plus tard, lorsque le changement

  • select date de départ
  • date de retour: sélection désactivée de toutes les dates avant la date de départ de sorte que la date de retour reste toujours devant la date de départ.

utilise actuellement ce qui suit, mais il fonctionne qu'une seule fois ...

 

$("#depart_date").datepicker(dp) 
    .on('changeDate',function(ev){ 


     $("#return_date").datepicker({ 
       format:defaultDateFormat, 
       autoclose:true, 
       startDate: $("#depart_date").val() 

      }); 

    }); 

comment suis-je en mesure d'atteindre cet objectif?

+0

partager jsfiddle plzz – thecodejack

Répondre

2

J'ai put this together for you dans jsFiddle, j'espère que cela répond à vos besoins. La chose à noter est qu'il existe une fonction setStartDate que vous devez utiliser sur votre programme datepicker si vous souhaitez mettre à jour la date minimale après son initialisation.

Html

<input type="text" class="span2" value="02-16-2012" id="depart-date"> 
<input type="text" class="span2" value="02-16-2012" id="return-date"> 

JavaScript

$(function() { 

    // create the departure date 
    $('#depart-date').datepicker({ 
     autoclose: true, 
     format: 'mm-dd-yyyy', 
    }).on('changeDate', function(ev) { 
     ConfigureReturnDate(); 
    }); 


    $('#return-date').datepicker({ 
     autoclose: true, 
     format: 'mm-dd-yyyy', 
     startDate: $('#depart-date').val() 
    }); 

    // Set the min date on page load 
    ConfigureReturnDate(); 

    // Resets the min date of the return date 
    function ConfigureReturnDate() { 
     $('#return-date').datepicker('setStartDate', $('#depart-date').val()); 
    } 

});​ 

Sinon, il y a un sélecteur plage de dates que quelqu'un a fait que l'on peut trouver here.

+0

super, merci ..! ne savais pas qu'il est si facile en définissant 'setStartDate' lol – flyclassic