ブートストラップナビゲーション矢印がdatepickerのためにありません

Question

正しいフォントファミリーが参照されていなかった問題がこれに類似していることがわかりました。しかし、私が使用しているバージョンでは、ナビゲーション矢印のアイコンを使用せず、HTMLの文字コードを二重左矢印と二重右矢印に使用します。

マイHTMLリファレンス -

<link href="Content/css/bootstrap.css" rel="stylesheet" /> 
<link href="Content/css/datepicker.css" rel="stylesheet" /> 
<link href="Content/css/navbar.css" rel="stylesheet" /> 
<link href="Content/css/jquery-ui.min.css" rel="stylesheet" /> 
<link href="Content/css/jquery-ui.structure.min.css" rel="stylesheet" /> 
<link href="Content/css/jquery-ui.theme.min.css" rel="stylesheet" /> 

<script type= "text/javascript" src="Scripts/jquery-2.2.0.min.js"></script> 
<script type= "text/javascript" src="Scripts/bootstrap.min.js"></script> 
<script type= "text/javascript" src="Scripts/bootstrap-datepicker.js"></script> 
<script type= "text/javascript" src="Scripts/moment.min.js"></script> 
<script type= "text/javascript" src="Scripts/jquery-ui.min.js"></script> 


<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".datepicker").datepicker({ 
      format: 'dd/mm/yyyy', 
      autoclose: true, 
      todayBtn: 'linked', 
      useCurrent: true, 
      ignoreReadonly: true 
     }) 
    }); 
</script> 

ここでは、ブートストラップ・datepicker.jsファイルから該当する符号化である - 私は取得していますすべては、一般的なヘッダーの背景と同じ灰色である

headTemplate: '<thead>'+ 
         '<tr>'+ 
         '<th colspan="7" class="datepicker-title"></th>'+ 
         '</tr>'+ 
         '<tr>'+ 
          '<th class="prev">&laquo;</th>'+ 
          '<th colspan="5" class="datepicker-switch"></th>'+ 
          '<th class="next">&raquo;</th>'+ 
         '</tr>'+ 
        '</thead>', 
    contTemplate: '<tbody><tr><td colspan="7"></td></tr></tbody>', 
    footTemplate: '<tfoot>'+ 
         '<tr>'+ 
          '<th colspan="7" class="today"></th>'+ 
         '</tr>'+ 
         '<tr>'+ 
          '<th colspan="7" class="clear"></th>'+ 
         '</tr>'+ 
        '</tfoot>' 
}; 

は、カレンダーの特定の日のように、通常の青色の「ホバーオーバー」が表示されます。

私は他の.cssファイルに「.prev」の定義が競合を探しましたが、テーブル、日付ピッカーやヘッダに特定のを見ていません。私は同じグリフコンを使ってコーディングを代用しようとしました。

マイjfiddle - ご提供フィドルに基づいて

JFiddle Coding samples

Answer 1

のjQuery UIが問題であるように、それが見えます。 .datepickerクラスの要素をオーバーライドし、.prevと.nextのテキストを、ビルドで有効でない相対パスを持つイメージベースのアイコンに置き換えます。

解決方法は、上記のコメントに対するあなたの回答に基づいて、適切な画像を追加するか、jQuery UIがDatepickerにフックしないようにすることです。

Answer 2

私はそれを解決した：

<script> 
$(document).ready(function(){ 

    $('#datepicker').datepicker({ 
    minDate: "01/01/1965", 
    maxDate: "12/31/2005", 
    startDate: "01/01/1965", 
    endDate: "12/31/2005", 
    changeYear: true, 
    changeMonth: true, 
    autoclose: true 
    }); 

    $('.prev i').removeClass(); 
    $('.prev i').addClass("fa fa-chevron-left"); 

    $('.next i').removeClass(); 
    $('.next i').addClass("fa fa-chevron-right"); 

}); 

をあなたのスプライトファイルを上のタグのクラスを削除し、以降の