Гадкий бутстрап - PullRequest
       2

Гадкий бутстрап

0 голосов
/ 25 сентября 2018

Я пытаюсь реализовать плагин bootstrap-datepicker.js.(https://bootstrap -datepicker.readthedocs.io / en / latest / ) У меня есть файлы .js и .css, но я получаю этот уродливый стандартный инструмент выбора даты jquery на китайском языке:

enter image description here

$('#test').datepicker({ });

Как я могу это исправить?

Мой код:

<input type="text" id="test" name="test" class="sm-form-control" placeholder="DD-MM-JJJJ" autocomplete="off">    

$(document).ready(function () {
    $('#test').datepicker({
         onSelect: function(d,i){
              if(d !== i.lastVal){
                  $(this).change();
              }
         }
    });
    $('#test').change(function(){
         console.log('Test');
    });
});

Спасибо, Майк

Ответы [ 2 ]

0 голосов
/ 25 сентября 2018

Существует конфликт между JQueryUI и Bootstrap для datepicker check Проверьте эту ссылку

$.fn.datepicker.noConflict = function(){
 $.fn.datepicker = old;
  return this;
  };

или вы можете использовать JQuery-UI

$( function() {
    $( "#test" ).datepicker({
    language: 'zh-TW'
    });     
  });
<meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
   <script src="i18n/datepicker-zh-TW.js"></script>
<body>
 
<p>Date:<input type="text" id="test" name="test" class="sm-form-control" placeholder="DD-MM-JJJJ" autocomplete="off">    

 </body>
0 голосов
/ 25 сентября 2018

Плагин поддерживает i18n для названия месяца и weekday и опцию weekStart.

По умолчанию используется английский (en);другие доступные переводы доступны в каталоге js / locales / , просто добавьте желаемый языковой стандарт после плагина.

Чтобы добавить больше языков, просто добавьте ключ в $ .fn.datepicker.dates перед вызовом .datepicker ().Пример:

$.fn.datepicker.dates['en'] = {
days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
daysMin: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
today: "Today",
clear: "Clear",
format: "mm/dd/yyyy",
titleFormat: "MM yyyy", /* Leverages same syntax as 'format' */
weekStart: 0

};

Языки справа налево также могут включать в себя rtl: true для правильного отображения календаря.

Если ваш браузер (или те,из ваших пользователей) неправильно отображает символы, скорее всего, браузер загружает файл javascript с кодировкой не-Unicode.Просто добавьте charset = "UTF-8" в тег скрипта:

<script src="bootstrap-datepicker.XX.js" charset="UTF-8"></script>

  $('.datepicker').datepicker({
    language: 'en'
   });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...