"You must enter a valid value" for number input on form submit?

Question

I'm using Angular JS v1.5.5 and defined a custom input field type currency that allows entering large numbers as e.g. 1.5k or 3.4M or 4T etc. This I accomplished defining a custom directive currency. The problem is that even when the display value is shown and the model contains a valid value, and when pressing form submmit I get the You must enter a valid value error.

This is the input field configuration as shown using the IE DOM explorer:

<div class="input-group">
  <input name="tradeParameters.tradeNotional" class="form-control ng-not-empty ng-valid ng-valid-required ng-dirty ng-valid-number ng-touched" id="tradeParameters_tradeNotional" required="required" type="number" step="1.0E-5" value="" ng-model="inSampleFormData.tradeParameters.tradeNotional" ng-required="true" currency="">
  <span class="input-group-addon">$</span>
</div>

The MainModule.ts defines the filter and directive as follows:

.filter('identity', ['$filter', function ($filter) {
    return function(input) {
        return input;
    };
}])
.directive("currency", function($filter, formatServices: FormatServices){
    var p = function(viewValue){
        if (angular.isDefined(viewValue)) {
            return $filter('identity')(formatServices.currParse(viewValue));
        }
    };

    var f = function(modelValue){
        if (angular.isDefined(modelValue)) {
            return $filter('identity')(formatServices.currFormat(modelValue));
        }
    };

    return {
        require: 'ngModel',
        link: function(scope, ele, attr, ctrl){
            ctrl.$parsers.unshift(p);
            ctrl.$formatters.unshift(f);
        }
    };
})

Yes indeed the question is why is checking the view value instead of the model value, the model value is correct. For example, a display value of 5k generates a model value of 5000 why it fails? can the validation be customized to account for this? or disabled altogether for this field? — SkyWalker, Aug 07 '17 at 08:43
I don't know how to make it check the `ng-model` value and not the one in the view but you can create your own custom type according to [this post](https://stackoverflow.com/a/14737259/6712896) — JeanJacques, Aug 07 '17 at 08:54
Is is the native browser error message? You can disable those by putting `no-validate` on the `form` element — devqon, Aug 07 '17 at 09:33

"You must enter a valid value" for number input on form submit?

0 Answers0