2015-05-27 49 views
3

如何禁用過去的日期過去的日期?引導日期選擇器:禁用後選擇的第一日期後的第設置

我已經嘗試過這種解決方案,但它沒有工作:This is not working

我的代碼:jsfiddle

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

var checkin = $('.form-control-1').datepicker({ 
    autoclose: true, 
    minViewMode: 1, 
    format: 'mm/yyyy' 

}).on('changeDate', function (ev) { 
    if (ev.date.valueOf() > checkout.datepicker("getDate").valueOf() || !checkout.datepicker("getDate").valueOf()) { 

     var newDate = new Date(ev.date); 
     newDate.setDate(newDate.getDate() + 1); 
     checkout.datepicker("update", newDate); 

    } 
    $('.form-control-2')[0].focus(); 
}); 


var checkout = $('.form-control-2').datepicker({ 
    beforeShowDay: function (date) { 
     if (!checkin.datepicker("getDate").valueOf()) { 
      return date.valueOf() >= new Date().valueOf(); 
     } else { 
      return date.valueOf() > checkin.datepicker("getDate").valueOf(); 
     } 
    }, 
    autoclose: true, 
    minViewMode: 1, 
    format: 'mm/yyyy' 

}).on('changeDate', function (ev) {}); 
+0

[什麼東西,已經有這個內置的?](https://github.com/dangrossman/bootstrap-daterangepicker) – br4d

+0

從經驗的到來,使用JQuery UI的日期選擇器。 bootstrap可能看起來不錯,但它不能很好地保持。 UI有內置的這個功能,並且有CSS使它看起來像引導項目。 https://jqueryui.com/datepicker/#date-range – bassxzero

+0

它需要一個monthpicker。我已經嘗試過的jQuery UI的日期選擇器 - http://jsfiddle.net/a3u68d20/12/但我怎麼可以設置爲顯示數月和數年纔剛剛像引導一個? – brunodd

回答

0

努力和嘗試後,我終於得到了這個,所以我在這裏共享的情況下,一個解決方案也有人需要這樣的:

Working jsfiddle

$(".line").each(function(index, element) { 

    var startDate = new Date(); 
    var fechaFin = new Date(); 
    var FromEndDate = new Date(); 
    var ToEndDate = new Date(); 

    /* Find 'From' */ 
    $(this).find(".form-control-1").addClass("from"+index); 

    /* Find 'To' */ 
    $(this).find(".form-control-2").addClass("to"+index); 


    $(".from"+index).datepicker({ 
    autoclose: true, 
    minViewMode: 1, 
    format: 'mm/yyyy' 
}).on('changeDate', function(selected){ 
     startDate = new Date(selected.date.valueOf()); 
     startDate.setDate(startDate.getDate(new Date(selected.date.valueOf()))); 
     $('.to'+index).datepicker('setStartDate', startDate); 
    }); 

$('.to'+index).datepicker({ 
    autoclose: true, 
    minViewMode: 1, 
    format: 'mm/yyyy' 
}).on('changeDate', function(selected){ 
     FromEndDate = new Date(selected.date.valueOf()); 
     FromEndDate.setDate(FromEndDate.getDate(new Date(selected.date.valueOf()))); 
     $('.from'+index).datepicker('setEndDate', FromEndDate); 
    }); 

}); 
相關問題