觸發兩個輸入點擊和附加圖標上的jQuery datepicker元素

Question

我有2個輸入字段包含默認日期，我使用jQuery的Datepicker插件從彈出日曆中選擇日期。目前，當用戶點擊<input>字段時，會顯示此日曆。

這是很好的工作，但我也想觸發日曆的彈出式，當用戶也點擊字段旁邊的日曆圖標，所以我想日曆顯示在兩個。

我使用Twitter的引導3

下面是我當前的Jquery：

$("#FromDate").datepicker({ 
     dateFormat: 'dd/mm/yy', 
     changeMonth: true, 
     changeYear: true, 
    }); 

    $("#ToDate").datepicker({ 
     dateFormat: 'dd/mm/yy', 
     changeMonth: true, 
     changeYear: true, 
    }); 

這是我的頁面的外觀

Answer 1

試試這個

$("#FromDate").datepicker({ 
         showOn: "button", 
         changeMonth: true, 
         changeYear: true, 
         buttonImage: "../../images/calendar.png", 
         buttonImageOnly: true, 
         buttonText: "Select date", 
         dateFormat: "dd/mm/yy" 
        }); 

$("#ToDate").datepicker({ 
        showOn: "button", 
        changeMonth: true, 
        changeYear: true, 
        buttonImage: "../../images/calendar.png", 
        buttonImageOnly: true, 
        buttonText: "Select date", 
        dateFormat: "dd/mm/yy" 
       }); 

編輯的引導

的Html

  <div class="col-lg-3"> 
       <div class="input-group"> 
        <input type="text" class="form-control" id="datepicker"> 
        <span class="input-group-btn"> 
         <button type="button" class="btn btn-default" id="btnPicker"> 
          <span class="glyphicon glyphicon-calendar"></span> 
         </button> 
        </span> 

       </div> 
       <!-- /input-group --> 
      </div> 

的Javascript

 $(function() { 
      $("#datepicker").datepicker({ 
       changeMonth: true, 
       changeYear: true, 
       dateFormat: "dd/mm/yy" 
      }).datepicker("setDate", new Date()); 

      $('#btnPicker').click(function() { 
       //alert('clicked'); 
       $('#datepicker').datepicker('show'); 
      }); 

     });