Как отображать указатель даты только при нажатии на значок с помощью Jquery?

Question

Я столкнулся с одной проблемой.Мне нужно отображать JQuery DatePicker только по щелчку значка.Я объясняю мой код ниже.

<input type="text" class="inputType2" id="car_d_date" value="">
<span class="globalcolor" id="calicon">
  <i class="icon-calendar-7"></i>
</span>

$(function(){
  $("#car_d_date").datepicker();
  $("#calicon").click(function(){
    $("#car_d_date").datepicker('show');
  })
})

В моем случае также нажмите поле ввода, которое показывает каландр.Здесь мне нужно, когда пользователь нажмет на иконку календаря, тогда календарь отобразится и выбранная дата будет отображена в текстовом поле.

Answer 1

Вы можете установить значение атрибута showOn DatePicker как пустое.

$("#car_d_date").datepicker({
  showOn: ''
});
$("#calicon").click(function(){
  $("#car_d_date").datepicker('show');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">

<input type="text" class="inputType2" id="car_d_date" value="">
<span class="globalcolor" id="calicon">
  <i class="icon-calendar-7">icon</i>
</span>