Использование jQuery Date Picker с пользовательской кнопкой запуска

Question

Как сделать так, чтобы jQuery Datepicker открывался с помощью определенной пользователем кнопки?

Answer 1

Есть встроенная поддержка для этого , имеющая значок или кнопку справа от текстового поля, например:

$("#datepicker").datepicker({
  showOn: 'button',
  buttonImage: 'images/calendar.gif',
  buttonImageOnly: true
});

Если вы хотите показать его с еще одну кнопку, или действительно любое событие, вызовите метод show , например:

$("#myButton").click(function() {
  $("#datepicker").datepicker("show");
});

Вы можете попробовать это здесь

Answer 2

Страница примеров в качестве примера того, как заставить сборщик данных появляться, нажав на значок:

здесь

Answer 3

Это HTML для значка выбора даты

onclick="show_date_picker('#datepicker_id');  on you icon element

Это функция для открытия и закрытия выбора даты при нажатии на значок

function show_date_picker(source_datepicker){
    if($(source_datepicker).datepicker("widget").is(":visible")){
        $(source_datepicker).datepicker("hide");
    }else{ 
        $(source_datepicker).datepicker("show"); 
    }
}

Answer 4

$("#checkin").datepicker({
  dateFormat: 'dd/mm/yy',
  minDate: '0',
  changeMonth: true,
  numberOfMonths: 1
 });

.datedivmng{
    float: left;position: relative;
}
.datedivmng .datepicker{
    position: relative;width: 87%!important;
    cursor: pointer;
}
.datedivmng:after {
    /* symbol for "opening" panels */
    font-family: 'FontAwesome';
    content: "\f073";
    color: #329ac4;
    font-size: 16px;
    text-shadow: none;
    position: absolute;
    vertical-align: middle;
    pointer-events: none;
    float: right;
    top: 2px;
    right: 7px;
}

<div class="datedivmng">
  <input type="text" id="checkin" name="checkin"  value="" /></div>