search

uxsolutions / bootstrap-datepicker

A datepicker for twitter bootstrap (@twbs)
Apache License 2.0
12.68k stars 6.06k forks source link

Calendar Icon Date Range Picker #879

Open EduardoRMello opened 10 years ago

EduardoRMello commented 10 years ago

How to add calendar icons in date range picker ?

Calendar -> input > to > input > calendar

This is possible ?

Viveksubramani commented 10 years ago

I wanted to add a calendar icon for date range picker, probably icon should be inside the input box. Is it possible?

Joyrex commented 10 years ago

Bootstrap does not support multiple addons in input groups on the same side (e.g.: you can have an addon on the left and right sides, but not two on the right or two on the left). Bootstrap also does not support multiple form-controls per input group.

I have done something similar (put an icon inside an input) for DataTables filter in BS 2.1.0: image

CSS: 

.searchClear {position:relative;}
i.icon.icon-remove {position:absolute; right: 8px; top: 2px; cursor:pointer; opacity: 0.2;}

HTML: 

<span class="searchClear"><input type="text" placeholder="type to filter results" class="search-query"><i class="icon icon-remove" rel="tooltip" title="Click to clear filter" data-placement="left"></i></span>