2017-09-22 21 views
0

with this Snippet私は2つの日付間の日付の配列を変数 "disabled"に格納して、ブートストラップのdatepickerの日付を無効にします。Bootstrap Datepicker datesDisabled with dynamic generated array not working

var startdate1 = $(".startdate1").text(); 
var enddate1 = $(".enddate1").text(); 

var daysBetweenDates = function(startdate1, enddate1) { 
    var now = startdate1, dates = []; 
    while (now.isBefore(enddate1) || now.isSame(enddate1)) { 
    dates.push(now.format("\"D.M.YYYY\"")); 
    now.add('days', 1); 
    } 
    return dates; 
}; 

var fromDate = moment(startdate1,"DD.MM.YYYY"); 
var toDate = moment(enddate1,"DD.MM.YYYY"); 
var results = daysBetweenDates(fromDate, toDate).join(', '); 

$('#results').html(results); 
var disabled = results; 

フロントエンドに出力される。 "2018年2月15日"、 "2018年2月16日"、 "2018年2月17日"、 "2018年2月18日"、 "2018年2月19日"、 "2018年2月20日"、 "21.2.2018"、 "22.2.2018"、 "23.2.2018"、 "24.2.2018"、 "25.2.2018"、 "26.2.2018"

ブートストラップdatepickerは、日付は私のDatePickerのインスタンスではなく、その中の変数にハードコードされています

$('.bdates').datepicker({ 
    format:    "dd.mm.yyyy", 
    keyboardNavigation: false, 
    daysOfWeekDisabled: "2,3,4,5,6", 
    daysOfWeekHighlighted: "0,1", 
    calendarWeeks:   true, 
    autoclose:    true, 
    todayHighlight:  true, 
    updateViewDate:  false, 
    datesDisabled:   disabled, 
    startDate:    startdate, 
    endDate:    enddate, 
    language:    "de" 
}); 

このフィドルjsfiddle.net/8k1um9k9/

で見てください

何が問題になりますか?誰かが私に解決策をお願いできますか? ありがとうございます!

答えて

0

下記の更新されたコードを試すことができますか?変更はコード内で//Changed hereとコメントアウトされています。基本的には、配列の配列をdatesDisabledに渡す必要があります。

var daysBetweenDates = function (startdate1, enddate1) { 
    var now = startdate1, dates = []; 
    while (now.isBefore(enddate1) || now.isSame(enddate1)) { 
     dates.push(now.format("D.M.YYYY")); //Changed here 
     now.add('days', 1); 
    } 
    return dates; 
}; 

var fromDate = moment(startdate1, "DD.MM.YYYY"); 
var toDate = moment(enddate1, "DD.MM.YYYY"); 
var results = daysBetweenDates(fromDate, toDate); //Changed here 
var disabled = results; //Changed here 

$('#results').html(results.join(', ')); //Changed here 
//var disabled = results; 

//this datepicker is not working with disabled dates variable 
$('.bdate').datepicker({ 
    format: "dd.mm.yyyy", 
    keyboardNavigation: false, 
    //  forceParse: false, 
    daysOfWeekDisabled: "2,3,4,5,6", 
    daysOfWeekHighlighted: "0,1", 
    calendarWeeks: true, 
    autoclose: true, 
    todayHighlight: true, 
    //updateViewDate: false, 
    datesDisabled: disabled, //Changed here 
    startDate: startdate, 
    endDate: enddate, 
    //language: "de" 
}); 
+0

ちょっとファニー、今それは完璧に動作します - ありがとうございます! – Alpin3Rocker

+0

@ Alpin3Rockerよろしくお願いします。 –