[http://jsfiddle.net/shykwoh3/2/]
<span class="input-group">
<input type="text"
class="form-control"
ng-model="hole.date"
/>
<!--
datepicker-popup="yyyy-MM-dd"
show-button-bar="false"
is-open="opened"
-->
<span class="input-group-btn">
<button type="button"
class="btn btn-default"
ng-click="showDatePicker();">
<i class="glyphicon glyphicon-calendar"></i>
</button>
</span>
</span>
I am trying to create a dynamic/on-demand date picker.
Explenation: I would like to have a single directive or controller function that can call or show a date picker but binding has to happen only on the fields which calander icons were clicked. I.E. It should not bind these input fields to a date picker etc. until the icon is clicked, the reson being, if I have lets say 1000 dates like these on a page, the page loads very slowly because of the date picker popup binding that is binded on page load.
The default popup datepicker works something like this:
Bootstrap.UI: angular-ui.github.io (Scroll down to Datepicker (ui.bootstrap.datepicker))
If anyone understands my problem and what I am trying to achieve please help me out: Something like Modal Date Picker but I don't want a Modal. The date picker should seem to work exactly like the popup date picker of http://angular-ui.github.io/bootstrap/ but the binding should not happen on page load, but on click only
