angularjs – ui-bootstrap-tpls-0 datepicker-popup not working manually entered

  angularjs, datepicker, javascript

I am using ui-bootstrap-tpls-0.12.0.js version. Its workign properly when i select date via calender option(format yyyy/MM/dd). However if I enter manually dates inside input text with the same format yyyy/MM/dd and click on save button. Date value is disappering from the input text box.

Please find my code below.

<p class="input-group" ng-controller="DatePickerController">
    <span class="input-group-btn">
        <button type="button" class="btn btn-default" ng-click="open($event)" disabled >
            <i class="glyphicon glyphicon-calendar"></i>
        </button>
    </span>
    <input  type="text" class="form-control" ng-model="ban.effectiveDate" ng-readonly="true" datepicker-popup="yyyy/MM/dd" is-open="opened" ng-required="true" tabindex = "-1" close-text="Close"/>
</p>

MyController :

angular.module('app').controller('DatePickerController', ["$scope",function ($scope) {
      $scope.today = function() {
        $scope.dt = new Date();
      };

      $scope.clear = function () {
        $scope.dt = null;
      };
      // Disable weekend selection
      $scope.disabled = function(date, mode) {
        return ( mode === 'day' && ( date.getDay() === 0 || date.getDay() === 6 ) );
      };

      $scope.toggleMin = function() {
        $scope.minDate = $scope.minDate ? null : new Date();
      };
      $scope.toggleMin();

      $scope.open = function($event) {
        $event.preventDefault();
        $event.stopPropagation();

        $scope.opened = true;
      };

      $scope.dateOptions = {
        formatYear: 'yy',
        startingDay: 1
      };

      $scope.today();
      $scope.format = 'yyyy/MM/dd';
}]);

enter image description here

Source: AngularJS Questions

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.