smalot / bootstrap-datetimepicker导航箭头丢失

Question

I'm having problems getting the arrows showing in the Bootstrap3 version of DateTime Picker ( https://github.com/smalot/bootstrap-datetimepicker ).

The example provided with the download is also missing the arrows, but the bootstrap2 example has them.

Everything else is working correctly and clicking the location where the arrows should be navigate as expected. I'm assuming that the browser is searching for the icons and they're where they're supposed to be.

Wondering if anyone has run into this issue and knows how to fix it? Otherwise maybe some suggestions as to how to troubleshoot would be appreciated.

Answer 1

This issue was resolved with a recent update to the repo. Otherwise, searching and replacing the following lines in ../bootstrap-datetimepicker.js has the same effect:

Replace:

    headTemplateV3:   '<thead>' +
                          '<tr>' +
                          '<th class="prev"><i class="icon icon-arrow-left"></i> </th>' +
                          '<th colspan="5" class="switch"></th>' +
                          '<th class="next"><i class="icon icon-arrow-right"></i> </th>' +
                          '</tr>' +
        '</thead>',

with:

headTemplateV3:   '<thead>'+
                        '<tr>'+
                            '<th class="prev"><i class="glyphicon glyphicon-arrow-left"/></th>'+
                            '<th colspan="5" class="switch"></th>'+
                            '<th class="next"><i class="glyphicon glyphicon-arrow-right"/></th>'+
                        '</tr>'+
                    '</thead>',

Answer 2

This drove me crazy for a while. The solution I found was to search the timepicker.js file for 'chevron' and change to the correct bootstrap format:

I was going to post an image but stackoverfow won't let me :(

So, search timepicker.js for 'chevron' and replace this:

<i class="icon-chevron-down"></i>

with this:

<i class="glyphicon glyphicon-chevron-down"></i>

Answer 3

只需检查您的minDate和maxDate选项是否正确，因为如果它们不正确，可能会丢失箭头

Answer 4

I was hosting the material-icon files locally.. this gave me serious issues. As soon as I defaulted back to the old link rel (snippet below), all IE problems were resolved...

Not sure what causes it.

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">