Всегда отображать bootstrap-datepicker, а не только в фокусе

Во-первых, убедитесь, что вы используете последнюю версию библиотеки, которая на данный момент 1.2. 0. исходная версия от eyecon довольно плохо документирована, и я не знаю, может ли она делать то, что ты хочешь.

Есть несколько способов решить вашу проблему. Используйте любой из них, который вы предпочитаете:

1. Создайте встроенное/встроенное средство выбора даты, а затем добавьте обработчик changeDate. Вам понадобится HTML, что-то вроде

   <input id="my-input">
   <div id="my-datepicker"></div>
   

   и следующий JavaScript:

   $("#my-datepicker").datepicker().on('changeDate', function (e) {
       $("#my-input").text(e.format());
   });
   

   Обратите внимание, что e.format — это удобный метод, описанный на странице events документации. , и при вызове, как здесь, вернет строку, представляющую выбранную дату, отформатированную в соответствии с строка формата.

   Вам нужно будет использовать свой собственный CSS, чтобы правильно расположить средство выбора даты, если вы выберете этот подход.

   Вот JSFiddle, демонстрирующий это в действии: http://jsfiddle.net/4wFJc/3/

2. Используйте обычный датчик ввода, явно показывайте его при создании и затем замените метод hide() средства выбора даты на недействующий, чтобы его никогда нельзя было скрыть.

   Излишне говорить, что это уродливый хак, который вполне может перестать работать в будущей версии библиотеки. Я бы не советовал его использовать. У него есть (сомнительное) преимущество перед подходом с встроенными блоками, заключающееся в том, что он позиционирует средство выбора даты для вас и включает стрелку, соединяющую его с вашим <input>, поэтому я включаю его для полноты картины.

   Вам понадобится HTML что-то вроде:

   <input id="my-input">
   

   и следующий JavaScript:

   $input = $("#my-input");
   $input.datepicker();
   $input.data('datepicker').hide = function () {};
   $input.datepicker('show');
   

   Вот JSFiddle, демонстрирующий этот подход в действии: http://jsfiddle.net/4wFJc/4/

Я не использую этот datepicker, поэтому я не знаком с тем, как он используется. Быстрый и грязный способ - дать классу раскрывающегося меню средства выбора даты .datepicker.CLASSNAME {display: block !important;}. Таким образом, раскрывающийся список всегда будет виден.

Если вы используете это средство выбора даты: http://www.eyecon.ro/bootstrap-datepicker/

Вы можете видеть, что есть метод: .datepicker('show')

Вызовите это для объекта datepicker, когда ваш $(document).ready()