0

I don't have a clue why this does not work for me.

I'm calling a this on a linkclick!

$('.pagination a').live('click', function(e) {
    e.preventDefault();
    var page = $(this).attr("data-ajax-link");

    //get classname of container box that should be reloaded
    var box = $(this).parent().parent();

    ajaxLoad(box, page, false);
    console.log(box); //takes some time as well! WHY?

});

And here the function that's triggered.

function ajaxLoad(targetBox, loadUrl) {

    console.log('start');
    console.log($(targetBox));

    $.ajax({
        url: loadUrl,
        dataType: "html",
        success: function(html,status) {
            console.log('end');

The weird thing I don't get is that console.log('start') is logged immediately in my console but console.log($(targetBox)); is not appear in the console until the success of the ajax function comes back!

why is that? Any idea?

This is the HTML that that is triggering the function.

<div class="list wide">        
     <div class="pagination">
          <span>&lt;</span>
          <em>[1]</em>
          <a data-ajax-link="/ajax/render/project/my?page=2" rel="next" href="/my/project/2">2</a>
          <a data-ajax-link="/ajax/render/project/my?page=2" rel="next" href="/my/project/2">&gt;</a>
     </div>
...

So the element I'm selecting with parent().parent() is the div.list. So actually .list should be logged immediately when clicking the link.

matt
  • 42,713
  • 103
  • 264
  • 397
  • I updated my question with some html. – matt Aug 10 '11 at 22:12
  • Well, those weired kind of errors do occur with jquery's ajax. Like one times i just changed the name of the file and it worked. Sometimes i need to dump the complete complete code and write again. I cant see any error in this – kritya Aug 10 '11 at 22:18
  • Must be. Check out my updated code. Even if the console.log() call is called outside of the ajaxLoad() function it take until the success come back. ? – matt Aug 10 '11 at 22:23
  • Of coure it will execute after the ajax is complete place it above the function ajaxloader if u want it to be done before ajax ? – kritya Aug 11 '11 at 05:03
  • NOPE! doesn't make a difference if I place it above or below the function! If I don't comment out the ajaxLoad() call in my click handler `console.log(box)` is not fired until the success of the ajax comes back -> even if it doesn't correlate. – matt Aug 11 '11 at 07:09

1 Answers1

0

Works for me in this simple example:

http://jsfiddle.net/vmkcG/

Can you update to show the context of this? That is, show this in the context of the function where it's being used to assign to box?

Christopher
  • 1,723
  • 1
  • 18
  • 31
  • yeah, I know that's weird. I updated my question with some html. – matt Aug 10 '11 at 22:13
  • Well, I updated my code! THIS IS THE WEIRDEST THING: Even in the click handler the list element doesn't get logged when it's called after ajaxLoad(). If I comment out the ajaxLoad() call it does work immediately. – matt Aug 10 '11 at 22:22
  • Is this perhaps because you're using live() instead of bind()? See http://stackoverflow.com/questions/937039/what-is-the-difference-between-the-bind-and-live-methods-in-jquery for some discussion. – Christopher Aug 17 '11 at 00:04