2013-06-15 4 views
0

J'utilise un widget Bootstrap DateTime dans mon template, j'ai placé côte à côte 2 widgets (From, To) pour sélectionner une plage de dates, d'heures ou de mois en fonction des besoins. J'ai lié les deux widgets, de sorte que l'utilisateur puisse toujours choisir la plage "À" moins que "De". A cette fin, j'ai ajouté ou soustrait les dates par des chiffres comme:Comment ajouter ou soustraire des dates, des jours, des mois dans le widget bootstrap datetime?

 var evDate = ev.date; 
     if (evDate != null) { 
      $('.'+reportCategoryTo.id). 
         datetimepicker('setStartDate', evDate); 
      var evDateObject = new Date(evDate.valueOf()); 
      var reportDateTimeCategoryFrom = report_date_time_category[0][0]; 
      var reportDateTimeCategoryTo = report_date_time_category[1][0]; 
      if (reportDateTimeCategoryFrom.category.indexOf("Daily") !== -1) { 
       var newDate = evDateObject.setDate(evDateObject.getDate() + 31); 
      } 
      else if (reportDateTimeCategoryFrom.category.indexOf("Monthly") !== -1) { 
       var newDate = evDateObject.setDate(evDateObject.getDate() + 365); 
      } 
      else { 
       var newDate = evDateObject.setDate(evDateObject.getHours() + 24); 
      } 

      var newDateObject = new Date(newDate); 
      $('.'+reportCategoryTo.id). 
         datetimepicker('setEndDate', newDateObject); 
      } 
     else { 
      console.log('The change is null',evDate); 
      $('.'+reportCategoryTo.id). 
          datetimepicker('setStartDate', null); 
      $('.'+reportCategoryTo.id). 
          datetimepicker('setEndDate', null); 
      } 
     }); 

Cette does'nt montre la plage lorsque l'utilisateur choisit comme 30 mai ou quelque chose de similaire. J'ai ensuite trouvé Datejs qui aide à ajouter ou soustraire des dates, etc je Datejs comme ceci:

  if (reportDateTimeCategoryFrom.category.indexOf("Daily") !== -1) { 
       var newDate = evDateObject.setDate(evDateObject.getDate().add(31).days()); 
      } 
      else if (reportDateTimeCategoryFrom.category.indexOf("Monthly") !== -1) { 
       var newDate = evDateObject.setDate(evDateObject.getDate().add(365)); 
      } 
      else { 
       var newDate = evDateObject.setDate(evDateObject.getHours().addHours(24)); 

Mais ma console invite cette erreur:

TypeError: evDateObject.getDate(...).add is not a function 

J'ai importé le fichier date.js mais même alors ça ne marche pas. S'il vous plaît aidez!

Répondre

1

Datejs est abandonnée, je ne recommanderais pas l'utiliser. Read here.

Vous pouvez envisager Moment.js, qui a également des fonctions pour l'arithmétique datetime.

Par exemple:

var m = moment(evDateObject.getDate()); 
m.add('months', 1); 
evDateObject.setDate(m.toDate()); 
1

En fait, vous n'avez pas besoin de vous soucier autant de la fonctionnalité que vous voulez implémenter, c'est assez simple si vous pouviez utiliser l'interface utilisateur jQuery. Utilisez exemple ci-dessous et à la bibliothèque jQuery prendra soin de vos besoins

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css"> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script> 

<form id="process_form" class="form" action="process.php" method="POST"> 
<label for="DOA">From:</label> 
<input type="text" id="txtDOA" name="txtDOA" required="" class="hasDatepicker"> 
<label for="DOD">To:</label> 
<input type="text" id="txtDOD" name="txtDOD" required="" class="hasDatepicker"> 
</form> 

$(function() 
    { 
     $("#txtDOA").datepicker({ 
      defaultDate: "+1w", 
      changeMonth: true, 
      numberOfMonths: 1, 
      onClose: function(selectedDate) { $("#txtDOD").datepicker("option", "minDate", selectedDate); } 
     }); 
     $("#txtDOD").datepicker({ 
      defaultDate: "+1w", 
      changeMonth: true, 
      numberOfMonths: 1, 
      onClose: function(selectedDate) { $("#txtDOA").datepicker("option", "maxDate", selectedDate); } 
     }); 
    }); 
Questions connexes