Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free.

Edit: This question is no longer relevant as of Angular version: 1.3.0-beta.12 you can now parse ng-minlength and ng-maxlength dynamic values. See: https://github.com/angular/angular.js/issues/5319

My problem is quite simple: I need to dynamically create input validation (ex. ng-minlength) using interpolation.

And doing that I am running into some issues specifically generating the validation attributes for ng-minlength and ng-maxlength. I assume this is due to them only taking constants?

Below you can see my code, the reason I am using a wrapper through outerForm is that I cannot dynamically generate the name attribute of input elements using interpolation, and that I have to wrap each set of repeated inputs in an ngForm directive and nest these in an outer form element.

So again, the problem lies in the attribute ng-minlength="field.ValidationAttributes['data-val-length-min']" not being properly set.

When I print the value directly using {{field.ValidationAttributes['data-val-length-min']}} the value appears correct.

Do I have to create a directive to parse my information, do I need to create my own min/max validation or am I simply running into a syntax error?

<form name="outerForm">
   <div ng-repeat="field in logEntry.StringValues">
      <ng-form name="innerForm">
         <input type="text" name="foo" ng-model="item.foo" ng-minlength="field.ValidationAttributes['data-val-length-min']" required/>
         <span ng-show="innerForm.foo.$error.required">required</span>
         <span ng-show="innerForm.foo.$error.minlength">to short</span>
      </ng-form>
   </div>
</form>
share|improve this question

1 Answer 1

up vote 1 down vote accepted

Hi you can use double {} to interpolate dynamic validation rules please see here: http://jsbin.com/xayiro/1/

If you can post you field.ValidationAttributes model I can update jsbin.

HTML:

 <ng-form name="innerForm">
     <input type="text" name="foo" ng-model="item.foo" ng-minlength="{{validation.minlength}}" required/>
     <span ng-show="innerForm.foo.$error.required">required</span>
     <span ng-show="innerForm.foo.$error.minlength">to short</span>
  </ng-form>

JS:

 $scope.validation= {

    maxlength:20,
    minlength:3
  };
share|improve this answer
    
Hey, thanks for the solution. I just now found out that my problem has been fixed in the lastest version of Angular. github.com/angular/angular.js/issues/5319 –  Nicklas Kevin Frank Jul 7 '14 at 8:39

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.