AngularJS Selecting Dynamic DOM elements created inside ng-repeat

1,524 views
Skip to first unread message

Raf Kewl

unread,
Oct 6, 2012, 12:50:40 PM10/6/12
to ang...@googlegroups.com
Hi,

I am trying to figure out the best way to select an element using jquery when it is created as a new DOM element inside ng-repeat while the Array for ng-repeat changes.
Here is a simple Fiddle problem to show the exact problem.

Please let me know the best way.

Thanks

Pawel Kozlowski

unread,
Oct 6, 2012, 12:58:14 PM10/6/12
to ang...@googlegroups.com
Raf,

Could you elaborate a bit on your use-case?
With AngularJS we very seldom need to access a DOM element in a
controller (in fact it is no-go most of the time), as there are often
easier / nicer ways of accomplishing things just with model
manipulation.

I can see that you are adding inputs and then trying to do something
with a class attribute but I'm not clear what...

Cheers,
Pawel
> --
> You received this message because you are subscribed to the Google Groups
> "AngularJS" group.
> To post to this group, send email to ang...@googlegroups.com.
> To unsubscribe from this group, send email to
> angular+u...@googlegroups.com.
> Visit this group at http://groups.google.com/group/angular?hl=en.
>
>



--
Question? Send a fiddle
(http://jsfiddle.net/pkozlowski_opensource/Q2NpJ/) or a plunk
(http://plnkr.co/)
Need help with jsFiddle? Check this:
http://pkozlowskios.wordpress.com/2012/08/12/using-jsfiddle-with-angularjs/

Looking for UI widget library for AngularJS? Here you go:
http://angular-ui.github.com/

Raf Kewl

unread,
Oct 6, 2012, 1:06:10 PM10/6/12
to ang...@googlegroups.com
Hi Pawel,

Yes my actual Use Case is a bit different than what I have done in the jsFiddle. The real scenario is that,

I have a custom Directive which binds the Bootstrapper Datepicker Plugin to the input field inside Ng-Repeat.
So every time a new datepicker is added, I want to set an attribute which states its maximum selectable date. But this date value is calculated inside the controller as it has to do with some other input values in a form. For example, my form have Contract Start and Contract End Date, and inside the contract form, I am adding different seasonal dates within the contract start and end date. Therefore, the first season will have the attribute set to allow selecting date range of the Contract. When the second season is added, I have to make the date range of the second datepicker starting from the ending date selected in the first season.

That is a real scenario.

Any ideas will be very helpful.

Thanks.

Roy Choo

unread,
Oct 8, 2012, 11:53:45 PM10/8/12
to ang...@googlegroups.com
http://jsfiddle.net/roychoo/ADukg/1042/ -> this is for the select last dom.

for the datepicker, this is an example fiddle, please only look at "datepicker" directive. the rest is from somebody's fiddle.
http://jsfiddle.net/roychoo/4cLmR/

What you can do is that you can store the last date selected in your scope model, then you will have a reference to the last date being selected.
Maybe you could create a jsfiddle to elaborate more.

regards
Roy
Reply all
Reply to author
Forward
0 new messages