CODEWITHSUNDEEP
angularjsdatepickertimepicker
Josh Petitt
Josh Petitt

Reputation: 9579

angularjs timepicker ng-change

I am using AngularJS TimePicker (ui.bootstrap.timepicker). I would like to fire an event when the timepicker is changed. I looked for an ng-change attribute, but did not find one.

My purpose is that I would like to save the changes that are made to the model when the time is changed. Right now I've used ng-model to set the model, but I cannot figure out how to notify the controller so it can perform the save (the model is serialized to localstorage). I would like to avoid the use of a "Save" button if possible.

On a related note, I would also like to do the same thing for ui.bootstrap.datepicker.

Upvotes: 5

Views: 17248

Answers (2)

Firozz
Firozz

Reputation: 19

You can use in script

     <input type='text' class="form-control" ng-model="callMeTime.startHour" ng-change= "addTime()" id='datetimepicker1' placeholder="End Time" onkeydown="return false"/>


  <script>
  <script type="text/javascript">
$(function() {
   
    $('#datetimepicker1').datetimepicker({
        format  : "HH:mm",
    });

    $('#datetimepicker1').datetimepicker().on('dp.change', function (event) {
        var user_time_picker1 = $("#datetimepicker1");
        user_time_picker1.val(this.value);
        user_time_picker1.trigger('input');
    });
    });
   </script>

Upvotes: 0

rajasaur
rajasaur

Reputation: 5450

You could use $scope.$watch to listen for changes to the timepicker (or datepicker) and call whatever is needed in the Controller. Here is a plunker that is based on the bootstrap example but alerts whenever the time is changed. You should be able to apply a similar logic for datepicker as well.

Upvotes: 11

Related Questions