access angularjs form field that contains a number

Question

I have a list of form fields that are generated as the result of an ng-repeat . As such I use the {{$index}} of the repeat loop to name the fields, i.e. ` which leads to:

<input name="myInput0">
<input name="myInput1">
<input name="myInput2">
...

etc. Now I'm trying to access the fields' $valid attribute from the form in the standard angularjs way i.e. myForm.myInput{{$index}}.$valid which resolves to e.g. myForm.myInput0.$valid which I understand won't work because it's accessing a variable and numbers won't be allowed.

However I then tried to access it with myForm['myInput{{$index}}'].$valid, e.g. myForm['myInput0'].$valid which I thought might work but still doesn't. Is there any way possible to access the form field when it contains a numeral? (or other illegal char like a hyphen)?

e: I'm using angularjs 1.2 which might explain why this isn't working. Does anyone know of a workaround for pre 1.3 angular?

from what I know it is possible to do this kind of thing `myForm.myInput0.$valid` even if it ends with a numeral — Ramon Marques, Jun 20 '17 at 18:47
I've just realised that it's probably the version of angularjs I'm using, I'm stuck on 1.2.19 and I beleive what I'm trying to do was only available in 1.3+? — ptr, Jun 20 '17 at 20:01

score 0 · Answer 1 · answered Jun 20 '17 at 19:44

0

The correct expression will look like myForm['myInput' + $index].$valid

answered Jun 20 '17 at 19:44

xReeQz

320
1
7

Would I be correct in thinking this won't work in angularjs 1.2? I forgot to mention that initially in the question. – ptr Jun 20 '17 at 20:02
Yeah, you're right. This works in 1.3+. 1.2 does not support dynamic names for inputs. – xReeQz Jun 20 '17 at 20:25
fair one, you answered the question I originally asked so if noone has a workaround by tomorrow I'll check this as answered – ptr Jun 20 '17 at 20:30
I believe here you'll find what you ultimately want to achieve - [Dynamic validation and name in a form with AngularJS](https://stackoverflow.com/questions/14378401/dynamic-validation-and-name-in-a-form-with-angularjs) – xReeQz Jun 20 '17 at 20:38

score 0 · Answer 2 · answered Jun 21 '17 at 02:06

I can think of two ways of workaround.

First option:

Put a ng-change on each input and validates it there manually.

Second option:

Retrieve all input elements, interate over each and validates manually

You can get them with this

var inputs = $document[0].querySelectorAll('#rankingForm input');

access angularjs form field that contains a number

2 Answers2