CODEWITHSUNDEEP
angularjsangularjs-directivedatepickerangular-ui
Sadeghbayan
Sadeghbayan

Reputation: 1163

Ui mask and datepicker in angular

here is the same question : Angular UI Bootstrap date-picker Combined With UI.Mask
and i can't find any soloution for that .
here is my plunk : http://plnkr.co/edit/i8TBYPonHd1ZxZc9Sac2?p=preview 

<div class="col-md-6">
    <p class="input-group">
       <input type="text" class="form-control" ui-mask="9999/99/99" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min-date="minDate" max-date="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />
       <span class="input-group-btn">
         <button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
       </span>
     </p>
</div>

the problem is these two directive don't work perfectly together .
Any idea ?
Many thanks

Upvotes: 3

Views: 7451

Answers (2)

Anderson Amaral
Anderson Amaral

Reputation: 11

Just add the jquery.maskedinput.js script.

Upvotes: 1

Lucas
Lucas

Reputation: 134

This worked for me:

angular.module('app', [])
    .config(function ($provide) {

      $provide.decorator('datepickerPopupDirective', function ($delegate) {
        var directive = $delegate[0];
        var link = directive.link;

        directive.compile = function () {
          return function (scope, element, attrs) {
            link.apply(this, arguments);
            element.mask("99/99/9999");
          };
        };

        return $delegate;
      });
    });

I found this answer here: Angular UI Bootstrap date-picker Combined With UI.Mask

Upvotes: 3

Related Questions