0

Example to demonstrate the issue can be found here:

http://jsfiddle.net/Byyu2/

As you can see only the first "Add" button triggers an event. The dynamically generated button does not. This is understandable as on page load these elements have not been created.

So what do I need to change to enable dynamically generated elements to also be registered to an event?

Thanks for looking.

3 Answers 3

3

The answer mentioned is quite old. If you can, upgrade to MooTools 1.3 instead of 1.2. In MooTools More, you will find the Element.Delegation package. The package handles delegation for all MooTools native events, except focus, blur, mouseenter and mouseleave.

You will find an updated JS Fiddle here: http://jsfiddle.net/Byyu2/1/

3
  • Thanks for your answer (and noted) but unfortunately, upgrading is not an option at the moment :( I think Brad did note my original jsfiddle was set to 1.1 which is why he directed me to that solution. Commented Dec 13, 2010 at 23:59
  • Aha, so he fluked the answer. Not sure whether to award the answer to him or not :) j/k Answer will be awarded once I get it working. Commented Dec 14, 2010 at 0:07
  • You have the right one. You should get it. ;) My answer is correct but not relevant since he needs MooTools 1.1 (which you figured out better than me).
    – Savageman
    Commented Dec 14, 2010 at 0:08
2

An answer on implementing .live (from jQuery) in mootools may be of some use.

4
  • Hmmm. So mootools does not do this natively. The solution (as far as I can tell) suggests I have to extend the Element object... boo mootools :( Commented Dec 13, 2010 at 23:45
  • Haven't got it working yet. But seems to be the answer. I've put that Element.implements() right at the top of my js but it doesn't seem to have been applied to the Element obj. hmm. digging around now. Commented Dec 14, 2010 at 0:22
  • I couldn't get it working for 1.1 (limited time) :( so the work-around that worked for me was re-registering all the buttons on button click :) Commented Dec 14, 2010 at 2:03
  • Any further improvements? That specific SO answer is referenced in a lot of blogs and such online, so I'm going on the assumptions it's a working solution. Unfortunately I don't use mootools, but if you do get it working it's probably worthwhile to edit your question with a corrected version. Commented Dec 14, 2010 at 16:25
1

What about using Element.cloneEvents?

Check this sample: http://jsfiddle.net/Byyu2/5/

It looks kind of ugly, because you can't call cloneEvents() directly on the new row (cloneEvents() does not work recursivly), but it works :-)

3
  • Thanks for your response. Interesting and Useful but clumsy if I have a few buttons. I have to search for each button then target the corresponding button that I want to clone the events from (if i understand correctly). Commented Dec 21, 2010 at 4:21
  • Can I clone events from the whole row? I tried this but it did not seem to work... Commented Dec 21, 2010 at 4:28
  • I do not see a way to do this, that's the reason I used the word "ugly" ;-).
    – CodeZombie
    Commented Dec 21, 2010 at 13:56

Not the answer you're looking for? Browse other questions tagged or ask your own question.