如何在图标单击上不仅在输入单击上打开bootstrap-datepicker

Question

Is it possible to open datepicker on click input or span with calendar icon?

http://www.eyecon.ro/bootstrap-datepicker

My code

<div class="input-group datepicker">
<label>Date</label>
<input type="text" class="form-control" placeholder="YYYY-MM-DD" value="" name="date">
<span class="input-group-addon"><span class="glyphicon calendar"></span></span>
</div>


$(document).ready(function(){
    $('.datepicker').datepicker({'format': 'yyyy-mm-dd'});
});

Span holds calendar icon and on click I want to show calendar.

Is this possible? How to do it?

Answer 1

Do you have to use the component with the calendar icon?

You could instead use the first or second component from here and add a background calendar image in input :

input {
background: url (path/to/your/calendar/image) no-repeat right center;
}