Hi there. I've been looking for hours on how to do this but can't seem
to find anything, perhaps my google-fu needs honing but I was hoping
someone could help me on here.
I have the following code:
window.addEvent('domready', function()
{
addEvents();
});
function addEvents()
{
var myFade = new Fx.Tween('builds_imagemenu');
$$('a.next', 'a.prev').each(function(ar)
{
ar.addEvent('click', function(event)
{
event.stop();
var req = new Request.HTML(
{
method: 'get',
url: ar.get('href'),
data: { 'do' : '1' },
onRequest: function()
{
$('builds_imagecontent').set('html',
'<div id = "loader"><img src
= "http://testing.solderpoint.com/habitatregina/img/builds_loader.gif"
alt = "Loading" /></div>');
},
onSuccess: function(responseTree,
responseElements, responseHTML,
responseJavaScript)
{
myFade.start('opacity',
0.0).chain(function()
{
$('builds_imagecontent').set('html',responseHTML);
myFade.start('opacity', 1.0);
}).chain(function()
{
imageMulti = new MultiBox('bi',
{descClassName: 'multiBoxDesc',
useOverlay: true});
}).chain(function()
{
addEvents();
});
}
}).send();
});
});
}
Now it works fine the first time. However the second time it doesn't
work. Now I'm pretty sure I know what's happening, the buttons are
being removed from the dom and then re-added, thus the events are
being erased. However according to the final part of my code, I am
understanding that it should be re-adding the events to the buttons,
but it isn't as far as I can tell. I am wondering if someone can tell
me how I should be doing this?