How can i add validation ng-maxlength into ng-repeat with error message?

Question

I have a simple code :

 <div class="row" ng-repeat="aDiagnosis in diagnosisListForPrescription"> <div class="col-md-4 padding-right-zero" id={{aDiagnosis.rowIndex}}> <input class="form-control" name="aDiagnosisName" ng-model="aDiagnosis.Name" ng-disabled="true"> </div> <div class="col-md-4 padding-right-zero form-group" show-errors id={{aDiagnosis.rowIndex}}> <input class="form-control" name="aDiagnosisResult" ng-maxlength="200" ng-model="aDiagnosis.Result" /> <p class="help-block" ng-if="form.aDiagnosisResult.$error.maxlength">Too Large</p> </div> </div>

and use $scope.form.$valid to generate the error message. But problem is since use ng-repeat every time it finds the same name and when i want to generate second list by clicking a button ,,first error message is gone and error-message now works on the second text (obviously). So How can i generate error-message each and every time dynamically ,,so every text form in ng-repeat,it has it's own error-message.

you can proceed this way link

X-Coder
– X-Coder

2015-07-12 10:31:16 +00:00
Commented Jul 12, 2015 at 10:31 — X-Coder
– X-Coder, Commented Jul 12, 2015 at 10:31

Ilya Dmitriev · Accepted Answer · 2015-07-12 11:12:48Z

You can generate dynamically name attribute of your inputs in ng-repeat. For example, you can put $index (or id of your objects or whatever you want) to generate unique name for your inputs.

<div class="row" ng-repeat="aDiagnosis in diagnosisListForPrescription"> <div class="col-md-4 padding-right-zero" id={{aDiagnosis.rowIndex}}> <input class="form-control" name="aDiagnosisName-{{$index}}" ng-model="aDiagnosis.Name" ng-disabled="true"> </div> <div class="col-md-4 padding-right-zero form-group" show-errors id={{aDiagnosis.rowIndex}}> <input class="form-control" name="aDiagnosisResult-{{$index}}" ng-maxlength="200" ng-model="aDiagnosis.Result" /> <p class="help-block" ng-if="form['aDiagnosisResult-' + $index].$error.maxlength">Too Large</p> </div> </div>

Example on plunker.

Tried this way ,,,but same result,,,can u create a plunker,,,,,may be it will helpful for me

Collectives™ on Stack Overflow

How can i add validation ng-maxlength into ng-repeat with error message?

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related