javascript - Bootstrap navigation arrows missing for datepicker -


i realize there similar questions problem correct font family not being referenced. however, in version using, don't use icon navigation arrows, use html character code double-left , double-right arrows.

my html references -

<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> 

here relevant coding bootstrap-datepicker.js file -

    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>' }; 

all getting same grey general header background, , normal blue "hover-over" particular day on calendar.

naughty datepicker

i looked conflicting ".prev" definitions in other .css files, didn't see specific tables, datepicker or headers. have tried substituting coding using glyphicons, same result.

my jfiddle -

jfiddle coding samples

based on provided fiddle, looks jquery ui problem. overriding elements of .datepicker class , replacing text in .prev , .next image-based icons relative paths aren't valid in build.

your solutions either add appropriate images (which, based on response comments above have chosen), or ensure jquery ui isn't hooking datepicker.


Comments

Popular posts from this blog

jOOQ update returning clause with Oracle -

java - Warning equals/hashCode on @Data annotation lombok with inheritance -

java - BasicPathUsageException: Cannot join to attribute of basic type -