Bootstrap UI. Datepicker block blur event.

I would like to have a table similar to excel. I have this for all my fields except datepicker ( http://angular-ui.imtqy.com/bootstrap/ ) When I double-click the date field to update it, the date picker does not appear even if there is autofocus in the input field. When I select a date, a blur event is fired, but the date picker does not change the value. If I remove the ng-blur event from the input field, autofocus will work (therefore, if I double-click on the field on which the date picker appears), and the date will change, but obviously I can not catch the blur event. The doneEditing function is used to store changes to the database and to edit fields (specifying a range or text input).

This is the code:

<div style="width: 70px; height:30px" ng-dblclick = "startEditing(item)" ng-hide="item.editing">
<span>{{item.date | date:"dd.MM.yyyy"}</span>
</div>
<form ng-show="item.editing" ng-submit="doneEditing(item)">
<input type="text" ng-focus="focusEditing(item)" ng-blur="doneEditing(item)" class="form-control" datepicker-popup="dd.MM.yyyy" ng-model="item.date" required autofocus readonly/>
</form>
+3
source share

All Articles