Question

OK, so, I use livequery() to bind a function to the click event of all links of class 'ajaxLink'. The function fires perfectly...once. After the first successful ajax call on a click, subsequent clicks don't fire the ajax, which means (I'm guessing) they aren't being bound by the livequery() code anymore.

I saw where others who had a similar issue moved their code outside the ready() function, so I tried that, to no avail (same results).

$('a.ajaxLink').livequery('click', function(e) {
  e.preventDefault();
  var target = $(this).attr('href') + '&ajax=y';
  var x = $(this).html();

  $.ajax({
   type: 'POST',
   url: target,
   //data: str,
   success: function(msg) {
    $('#mainPanel').slideUp(500, function() {
     $(this).html(msg).slideDown(1000);
    });
   }
  });
 })

Let me know if you need more detail. Thank you in advance for your help! This site is excellent.

Was it helpful?

Solution

.livequery() has issues depending on which version and some special DOM cases. However, you can ignore that problem...since you're doing something that works off events, you can use the built-it .live() here (available in jQuery 1.3+), like this:

$('a.ajaxLink').live('click', function(e) {
  e.preventDefault();

  $.ajax({
    type: 'POST',
    url: $(this).attr('href') + '&ajax=y',
    //data: str,
    success: function(msg) {
      $('#mainPanel').slideUp(500, function() {
        $(this).html(msg).slideDown(1000);
      });
    }
  });
});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top