Damn Guys! Now thats super clean code! I cant believe how muych simpler that makes the code. Thanks so much for the help and nudge in the right direction.
On Jan 31, 8:42 pm, Sean McArthur <[email protected]> wrote: > There is an > Element.Delegation<http://mootools.net/docs/more/Element/Element.Delegation>module > in MooTools More. > > It allows this: $('#myUL').addEvent('click:relay(li a)', myHandlerFn); > > On Mon, Jan 31, 2011 at 7:45 AM, Clement Hallet <[email protected]> wrote: > > Nice ! I'm getting used to be amazed with already what's already inside > > Mootools ! > > > Le 31 janv. 2011 à 16:32, Ryan Florence a écrit : > > >http://ryanflorence.com/event-delegation-with-mootools-quit-selecting... > > > > On Jan 31, 2011, at 8:21 AM, Clement Hallet wrote: > > > >>> Your "ul" element will receive all the clicks from any element inside > > it, (if the event is not stopped of course) > > >>> the ones that exists, and the ones that may be created later. > > > >> Code updated to see click handling on new elements : > >http://jsfiddle.net/QXsMM/9/ > > > >> Le 31 janv. 2011 à 16:11, Clement Hallet a écrit : > > > >>> As told before, you can use the event delegation : > > > >>> Your "ul" element will receive all the clicks from any element inside > > it, (if the event is not stopped of course) > > >>> the ones that exists, and the ones that may be created later. > > >>> This is called "bubbling" and there is several article about this. > > > >>> By using that behavior you can write this code : > >http://jsfiddle.net/QXsMM/6/ > > > >>> This is the same mechanism as the one from the jQuery Live plugin. > > > >>> -- > > >>> Clément > > > >>> Le 31 janv. 2011 à 15:42, roark a écrit : > > > >>>> Hi Clement, > > > >>>> Thanks for the quick response! > > > >>>> I have added the code on jsfiddle so it can be viewed here: > > >>>>http://jsfiddle.net/roark/QXsMM/5/ > > > >>>> Thanks again for your help > > > >>>> On Jan 31, 4:07 pm, Clement Hallet <[email protected]> wrote: > > >>>>> Hi, > > > >>>>> You can use only one listener and deals with event delegation. > > >>>>> Could you please put your code onhttp://jsfiddle.net/andi'll try to > > help you. > > > >>>>> -- > > >>>>> Clément > > > >>>>> Le 31 janv. 2011 à 15:00, roark a écrit : > > > >>>>>> Hi Everyone, > > > >>>>>> I think I must be writing bad code here. > > > >>>>>> I will load a page with a few li's with links in them. once loaded, > > I > > >>>>>> add events to the links > > >>>>>> [code] > > >>>>>> $$('li a').each(function(el){ > > >>>>>> el.addEvent('click',function(e){ > > >>>>>> e.stop(); > > >>>>>> //code to execute > > >>>>>> }); > > >>>>>> }); > > >>>>>> [/code] > > > >>>>>> Then when I create an element dynamically I am writing the same code > > >>>>>> again: > > >>>>>> [code] > > >>>>>> var li = new Element('li').inject($('ul.list')); > > >>>>>> var del = new Element('a', {'class':'delete sprite', > > >>>>>> 'title':'delete'+player.name}).inject(li); > > >>>>>> //code being repeated > > >>>>>> el.addEvent('click',function(e){ > > >>>>>> e.stop(); > > >>>>>> //code to execute > > >>>>>> }); > > >>>>>> [/code] > > > >>>>>> It may not look like much but when I send requests the code gets > > long > > >>>>>> and it seems I'm duplicating code when I add the 'click' event. > > > >>>>>> This seems like bad code to me, but can't think of a way to write it > > >>>>>> any more efficient > > >>>>>> Any input is greatly appreciated!
