jQuery AJAX Issue ignoring return false onclick

  • RockmanTV
  • Proficient
  • Proficient
  • RockmanTV
  • Posts: 348

Post 3+ Months Ago

I have an issue that I'm not really sure what to do with as I have no idea what's going on. The following code is used on a site that I want to run as an ajax site. Essentially when you click on one of the main navigation links above (except for the last one) I want it to load that information into the body of the site and then load the new navigation in the top by posting the clickID variable that indicates to the site which navigation to load. The PHP backend is sound.

The problem is this. I'll click on one of the main navigation links and everything will work fine. Then I click on a different one and instead of ignoring the click like the javascript should it allows the browser to go ahead and do the link. It does this in pairs. The odd time the Ajax works great, the even time it seemingly ignores the return false and allows the click to go through.

The reason I have the link there in the first place is because I want to enable non-javascript users to use the site (they just have to deal with full page reloads vs. just swapping out content). Can anyone tell me what's going on?



Code: [ Select ]
// AJAX Page Changing
$("#mContainer a:not(:last)").click(function(){
  var clickID = $("#mContainer a:not(:last)").index(this);
  $("#body").load("/includes/pages/"+$(this).attr("href")+".php");
  $("#mContainer").load("/includes/topnav.php",{ajaxtab:clickID});

  return false;
});
//
  1. // AJAX Page Changing
  2. $("#mContainer a:not(:last)").click(function(){
  3.   var clickID = $("#mContainer a:not(:last)").index(this);
  4.   $("#body").load("/includes/pages/"+$(this).attr("href")+".php");
  5.   $("#mContainer").load("/includes/topnav.php",{ajaxtab:clickID});
  6.   return false;
  7. });
  8. //
  • RockmanTV
  • Proficient
  • Proficient
  • RockmanTV
  • Posts: 348

Post 3+ Months Ago

Actually I figured out what's wrong, but not entirely sure what to do in order to fix it. What's going on is that I'm replacing all of the links that are bound by the onclick event so on the even time it doesn't see the return false. When the page reloads it becomes bound again and then sees it which is why it works and that doesn't work on alternating times. How would I go about binding the the new links with the same function in my example?
  • RockmanTV
  • Proficient
  • Proficient
  • RockmanTV
  • Posts: 348

Post 3+ Months Ago

I found the solution with the using the live method. I'll leave this post here in case someone else has the same issue if that's ok.
  • UPSGuy
  • Lurker ಠ_ಠ
  • Web Master
  • User avatar
  • Posts: 2733
  • Loc: Nashville, TN

Post 3+ Months Ago

That's absolutely fine. Thanks for coming back to share your solution. Sorry we didn't get in a little faster to assist, but 12 minutes is a pretty tight window. :)
  • RockmanTV
  • Proficient
  • Proficient
  • RockmanTV
  • Posts: 348

Post 3+ Months Ago

Yea sorry!

I usually try to avoid posting things unless I need to, but this was just my inexperience with jQuery shining through.

Post Information

  • Total Posts in this topic: 5 posts
  • Users browsing this forum: No registered users and 86 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.