2017-10-03 22 views
1

JSONファイルから選択した日付を、DateTimePickerの赤い背景にハイライト表示する必要があります。datetimepickerで日付が強調表示されないのはなぜですか?

私は、Jqueryのajax呼び出しを使用して日付を渡しています。日付はのJSONファイルに保存されているMMDDYYYY形式です。

私のコードJSはこれです:

$(function() { 
    $('#datetimepicker5').datetimepicker({ 
     defaultDate: "10/01/2017", 
     disabledDates: [ moment("10/05/2017"), 
      new Date(2018, 11 - 1, 21), 
      "11/22/2017", "11/23/2017"] 
    }); 
}); 

$.ajax({ 
    type: "GET", 
    url: "date.json", 
    success: function (data) 
    { 
     var count = Object.keys(data).length; 
     for(var i=0;i<count;i++) 
     { 
      var a = data[i].date; 
      $("#datetimepicker5").datetimepicker({ 
       beforeShowDay: function(a) 
       { 
        var Highlight = a; 
        if(Highlight){ 

         return[true, "Highlighted", Highlight]; 
        } 
        else { 
         return ['true','','']; 
        } 
       } 
      }); 
      { 
      } 
     } 
    }, 
}, 
    dataType: "json" 
}); 

そしてCSSコードはこれです:ここでは

.Highlighted a{ 
    background-color : Green !important; 
    background-image :none !important; 
    color: White !important; 
    font-weight:bold !important; 
    font-size: 12pt; 
} 

td.highlight { 
    background-color: red; 
    border: 1px blue solid; 
} 

JSONデータです:

[ 
    {"date":"10/05/2017"}, 
    {"date":"10/09/2017"}, 
    {"date":"10/02/2017"}, 
    {"date":"10/10/2017"} 
] 
+0

ajax呼び出しは '.ready'関数の外にあります。 'dataType:" json "'はajax呼び出しの外にあります。また、いくつかの閉じ括弧がありません。 – adiga

+0

私は思うような構文エラーがあります。 'else { return ['true'、 ''、 '']; }}} ) {}} }、 }、 データ型: "JSON" ' – Meloman

答えて

0

あなたのJSのために、私はちょうどインデントを修正し、問題を発見しました。

$(function() { 
    $('#datetimepicker5').datetimepicker({ 
     defaultDate: '10/01/2017', 
     disabledDates: [ 
      moment('10/05/2017'), 
      new Date(2018, 11 - 1, 21), 
      '11/22/2017', 
      '11/23/2017' 
     ] 
    }); 
    $.ajax({ 
     type:  'GET', 
     url:  'date.json', 
     dataType: 'json', 
     success: function(data) { 
      var count = Object.keys(data).length; 
      for(var i=0; i<count; i++) { 
       var a = data[i].date; 
       $('#datetimepicker5').datetimepicker({ 
        beforeShowDay: function(a) { 
         var Highlight = a; 
         if(Highlight) { 
          return [ 
           'true', 
           'Highlighted', 
           'Highlight' 
          ]; 
         } 
         else { 
          return [ 
           'true', 
           '', 
           '' 
          ]; 
         } 
        } 
       }); 
      } 
     } 
    }); 
}); 
関連する問題