validate inside repeat

4,968 views
Skip to first unread message

E_lexy

unread,
May 28, 2012, 5:21:44 AM5/28/12
to ang...@googlegroups.com
I am trying to validate URLs inside a ng-repeat blovk, but I can't seem to find the handle to ng-show the error:

Peter Bacon Darwin

unread,
May 28, 2012, 5:31:02 AM5/28/12
to ang...@googlegroups.com
Tidied it up a bit.  See if this gets you any further...


Pete

On 28 May 2012 10:21, E_lexy <alex...@gmail.com> wrote:
I am trying to validate URLs inside a ng-repeat blovk, but I can't seem to find the handle to ng-show the error:

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/52n0U5DA4hIJ.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/angular?hl=en.

Pawel Kozlowski

unread,
May 28, 2012, 7:02:46 AM5/28/12
to ang...@googlegroups.com
Hi!
Here is a working jsFiddle: http://jsfiddle.net/pkozlowski_opensource/XK2ZT/2/

There are numbers of things going on here / should be observed:

1) You can't (without using a custom directive) to dynamically
generate a name of an input :-( Indead, looking at
http://docs.angularjs.org/api/angular.module.ng.$compileProvider.directive.input
we can see that the name attribute accepts a string only;

2) Strangly enough the input of type 'url' won't show any value if the
url provided is invalid. I need to dig into this a bit as it seems to
be counter-intuitive.

3) To solve the 'dynamic name' problem you need to create an inner
form (see ng-form); the other alternative would be to write a custom
directive for this. BTW: I have found this trick with an inner form
while searching this mailing list, this topic pops up from time to
time so there are other solutions as well.

Hope this helps,
Pawel

E_lexy

unread,
May 28, 2012, 9:12:56 AM5/28/12
to ang...@googlegroups.com
Thanks guys, that did it!

mvish...@gmail.com

unread,
Jul 18, 2012, 8:43:08 AM7/18/12
to ang...@googlegroups.com

how to get inner form value using form name in AngularJS

Sebastian Sebald

unread,
May 16, 2013, 4:56:51 PM5/16/13
to ang...@googlegroups.com, mvish...@gmail.com
Is it still not possible do something like "$scope.myForm.mySubForm.item[0]"?

I would like to programatically set form fields inside a ngRepeat $dirty. I know that it its possible to acces elements from scope (example: http://jsfiddle.net/EF5Jp/) and I could get the ngModelController from that element via .controller('ngModel') and then set the fields dirty and add/remove the css classes. But this seems not really clean :-/

Sebastien Cesbron

unread,
May 17, 2013, 2:00:52 AM5/17/13
to ang...@googlegroups.com
Hi

The subform trick has some problems. All your inputs have the same name so the browser autocomplete feature is no more usable.

I tried to use a directive to have custom names but in my case there is a problem of propagation of validation to the main form : http://plnkr.co/edit/7RLhI4K13ugy4KIlAW2b?p=preview

My input created by the directive work well but if you remove the value the required error is not propgated to the form. I guess this is another problem of how form handle inputs but I can't overcome it.

Regards
Seb

Luciano Amodio

unread,
Jul 11, 2013, 8:55:55 AM7/11/13
to ang...@googlegroups.com
Did you find a solution to this problem? I'm going crazy with it

matthieu...@gmail.com

unread,
Jul 18, 2013, 8:39:19 AM7/18/13
to ang...@googlegroups.com
Up, I'm also going crazy trying to create a directive that works either with top-level and nested fields (I want to access the nested input which is inside a ng-repeat).

Nested ng-form didn't help, yet.

Thanks :)

matthieu...@gmail.com

unread,
Jul 18, 2013, 4:07:44 PM7/18/13
to ang...@googlegroups.com
Hey, it's not that difficult finally, after hours of work :)

Nested forms is the way to go, here is a working example using a directive (with two levels of nested fields) : http://plnkr.co/edit/pg2NJSdoF1JPmHmdpRnP?p=preview

When an input is dirty and invalid, the error message is displayed.

If the user submits the form while it's invalid, it will displays every inputs with an validation error.

Llyle van Schalkwyk

unread,
Mar 4, 2014, 5:26:56 PM3/4/14
to ang...@googlegroups.com
This is exactly what I needed, thank you!

Angular doesn't handle ngForm in a ngRepeat well from the JavaScript end, because the nested form variable has the same name as per the form name, and there is no support for dynamic form names - I tried and failed.

From the controller I was seeing:
$scope
.mainForm
.lineItemForm <---- This is the variable clash for the ngRepeat scoped form
 
Relying on a directive based approach now works well for me, because showing field validation errors are now scoped appropriately per nested form. And... using directives like this is really the more Angular way rather than creating thick controllers.
Reply all
Reply to author
Forward
0 new messages