2015-06-11 4 views
0

Цель:
Получить текущую дату, а затем пропустить ее в поле «дата-дата» (для даты начала и окончания) и идентификатора startDate и endDate.Показать текущую дату в datepicker

Проблема:

Код:

var d = new Date(); 
var strDate = d.getFullYear() + "-" + (d.getMonth()+1) + "-" + d.getDate(); 

$('.dp4').html(strDate); 
$('.dp5').html(strDate); 
$('#startDate2').html(strDate); 
$('#endDate2').html(strDate); 

отлично работает, когда я использую JSFiddle, но не тогда, когда я объединить его с DatePicker.

Не удается найти неисправность.

https://jsfiddle.net/cszwtnsv/
http://www.eyecon.ro/bootstrap-datepicker/


<!DOCTYPE html> 
    <html lang="en"> 
     <head> 
     <meta charset="utf-8"> 
     <title>Datepicker for Bootstrap, from Twitter</title> 
     <link href="css/bootstrap.css" rel="stylesheet"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
     <link href="C:\1\Datepicker for Bootstrap, from Twitter_files\datepicker.css" rel="stylesheet"> 

     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
     <script src="C:\1\Datepicker for Bootstrap, from Twitter_files\jquery.js"></script> 
     <script src="C:\1\Datepicker for Bootstrap, from Twitter_files\bootstrap-datepicker.js"></script> 

     <script> 
     if (top.location != location) { 
     top.location.href = document.location.href ; 
     } 
      $(function(){ 
       window.prettyPrint && prettyPrint(); 
       $('#dp1').datepicker({ 
        format: 'mm-dd-yyyy' 
       }); 
       $('#dp2').datepicker(); 
       $('#dp3').datepicker(); 
       $('#dp3').datepicker(); 
       $('#dpYears').datepicker(); 
       $('#dpMonths').datepicker(); 


       var startDate = new Date(2015,1,20); 
       var endDate = new Date(2015,1,25); 
       $('#dp4').datepicker() 
        .on('changeDate', function(ev){ 
         if (ev.date.valueOf() > endDate.valueOf()){ 
          $('#alert').show().find('strong').text('The start date can not be greater then the end date'); 
         } else { 
          $('#alert').hide(); 
          startDate = new Date(ev.date); 
          $('#startDate').text($('#dp4').data('date')); 
         } 
         $('#dp4').datepicker('hide'); 
        }); 
       $('#dp5').datepicker() 
        .on('changeDate', function(ev){ 
         if (ev.date.valueOf() < startDate.valueOf()){ 
          $('#alert').show().find('strong').text('The end date can not be less then the start date'); 
         } else { 
          $('#alert').hide(); 
          endDate = new Date(ev.date); 
          $('#endDate').text($('#dp5').data('date')); 
         } 
         $('#dp5').datepicker('hide'); 
        }); 

      // disabling dates 
      var nowTemp = new Date(); 
      var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0); 

      var checkin = $('#dpd1').datepicker({ 
       onRender: function(date) { 
       return date.valueOf() < now.valueOf() ? 'disabled' : ''; 
       } 
      }).on('changeDate', function(ev) { 
       if (ev.date.valueOf() > checkout.date.valueOf()) { 
       var newDate = new Date(ev.date) 
       newDate.setDate(newDate.getDate() + 1); 
       checkout.setValue(newDate); 
       } 
       checkin.hide(); 
       $('#dpd2')[0].focus(); 
      }).data('datepicker'); 
      var checkout = $('#dpd2').datepicker({ 
       onRender: function(date) { 
       return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : ''; 
       } 
      }).on('changeDate', function(ev) { 
       checkout.hide(); 
      }).data('datepicker'); 
      }); 
     </script> 

     <script> 

    var d = new Date(); 
    var strDate = d.getFullYear() + "-" + (d.getMonth()+1) + "-" + d.getDate(); 

    $('.dp4').html(strDate); 
    $('.dp5').html(strDate); 
    $('#startDate').html(strDate); 
    $('#endDate').html(strDate); 

     </script> 

     <style> 
     .container { 
      background: #fff; 
     } 
     #alert { 
      display: none; 
     } 
     </style>  

     </head> 

     <body> 
     <div class="container"> 
     <section id="typeahead"> 




      <div class="row"> 


      <div class="span9 columns"> 




       <div class="well"> 

       <div class="alert alert-error" id="alert"> 
        <strong>Oh snap!</strong> 
        </div> 
       <table class="table"> 
        <thead> 
         <tr> 
          <th>Start date<a href="#" class="btn small" id="dp4" data-date-format="yyyy-mm-dd" data-date="2015-2-21">Change</a></th> 
          <th>End date<a href="#" class="btn small" id="dp5" data-date-format="yyyy-mm-dd" data-date="2015-2-25">Change</a></th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr> 
          <td id="startDate"> 
          </td> 
          <td id="endDate"> 
          </td> 
         </tr> 
        </tbody> 
       </table> 
       </div> 





      </div> 
      </div> 
     </section> 
    </div> 


     </body> 
    </html> 

ответ

0

Может быть ваша строка

var strDate = d.getFullYear() + "-" + (d.getMonth()+1) + "-" + d.getDate(); 

"2015-6-11" не соответствует формату "2015-06-11" (гггг -mm-dd)

+0

Я пробовал его с помощью жесткого кодирования, добавив «2015-6-11» вместо «2015-06» -11 ". В итоге он работал –

Смежные вопросы