0

I am creating dynamic textboxes using AngularJS. I want a datepicker to show on every textbox.

Here is my angular code

<tr ng-repeat="shift in shifts">

                        <td>
                            <input type="text" ng-model="shift.ShiftName" />
                        <td>
                            <div class="input-append bootstrap-timepicker">
                                <input type="time" ng-model="shift.StartsAt" />
                            </div>
                        <td>
                            <div class="input-append bootstrap-timepicker">                                
                                <input type="time" ng-model="shift.EndsAt" />
                            </div>
                        </td>
                        <td><a href="#" class="btn btn-danger" ng-click="removeShift(shift.ShiftId)"><span class="icon-remove icon-white"></span>Remove</a></td>

                    </tr>

Normally, if it was a static textbox, I would include a datepicker like this:

$("#textbox").datepicker();

However, my textboxes are dynamic, so I cannot use this technique here.

I tried specifying a class to all the textboxes and then use the jQuery datepicker function, but I could not show the datepicker.

Shuaib
  • 779
  • 2
  • 13
  • 47
  • possible duplicate of [putting datepicker() on dynamically created elements - JQuery/JQueryUI](http://stackoverflow.com/questions/10433154/putting-datepicker-on-dynamically-created-elements-jquery-jqueryui) – urbz Jan 14 '15 at 11:46
  • 2
    Create a directive to wrap the jquery datapicker initialization. Then just add the directive to input element. Check this post to get idea about directive for jquery date. http://stackoverflow.com/questions/18144142/jquery-ui-datepicker-with-angularjs – erandac Jan 14 '15 at 11:51

0 Answers0