1

I have this HTML:

<input type="date" date="MM-dd-yyyy" required data-ng-model="customerFormData.customer.BirthDate" />

And this is my directive (from this fiddle of P. Kozlowski)

app.directive('date', function (dateFilter) {
    return {
        require: 'ngModel',
        link: function (scope, elm, attrs, ctrl) {
            debugger;
            var dateFormat = attrs['date'] || 'yyyy-MM-dd';
            var minDate = Date.parse(attrs['min']) || 0;
            var maxDate = Date.parse(attrs['max']) || 9007199254740992;

            ctrl.$parsers.unshift(function (viewValue) {
                var parsedDateMilissec = Date.parse(viewValue);
                if (parsedDateMilissec > 0) {
                    if (parsedDateMilissec >= minDate && parsedDateMilissec <= maxDate) {
                        ctrl.$setValidity('date', true);
                        return parsedDateMilissec;
                    }
                }

                // in all other cases it is invalid, return undefined (no model update)
                ctrl.$setValidity('date', false);
                return undefined;
            });

            ctrl.$formatters.unshift(function (modelValue) {
                return dateFilter(modelValue, dateFormat);
            });
        }
    };
});

But my date field doesn't get a value, it keeps saying dd-mm-jjjj (Duth notation).

I set the value of customerFormData.customer.BirthDate in the code to new Date().getTime(); to test this, but like I said, it doesn't work.

What I want to achieve is that a input type date is bind to my date fields.

Martijn
  • 24,441
  • 60
  • 174
  • 261
  • Can you provide your own fiddle? – Stewie Jun 11 '13 at 10:04
  • The binding itself will probably work just fine (if you use the correct format, `dd-MM-yyyy`), but it depends on your browser if it will show that format in the actual input field (which, according to [this answer](http://stackoverflow.com/a/9519493/893780), it probably won't). – robertklep Jun 11 '13 at 10:10
  • Thanks, but I've chosen to use a directive that wraps the jquery datepicker widget. – Martijn Jun 11 '13 at 12:36
  • 1
    The native HTML5 date field in Chrome does not integrate correctly with ng-change and ng-model. If one selects a date from the selector, the change is not reflected. If one writes a date with the keyboard, the change is reflected in the model. Is this your setting? Is it worth a bug report? – rewritten Jun 11 '13 at 13:25
  • .yes this is the behavior. I have run into it myself. you will need your own solution or use someone elses. – Ray Garner Oct 14 '13 at 11:02

0 Answers0