So, this is the scenario - Everytime, my page (which has an embedded view) loads, an AJAX requestis fired fetching new data to the view (from an external source). Once the response comes back, I refresh the view (make an AJAX request to views_embed_view()) to display the fetched data with the rest. Now, this works fine.

The problem is when I try to flag (JS flag - toggle type) one of the view's rows. (which has a flag as a field), the Javascript breaks and I get redirected to the page to which the earlier views refresh request was made. (This doesn't make sense to me at all!).

Like I said, if I comment out the JS code which writes to the DOM/refreshes the view (ie something like $(element).html(ajaxResponse)), the flag works but doesn't otherwise. I am really not sure what the problem is. Do try to see if you can reproduce it. If yes, would be great if you can let me know how I can fix this.

Comments

quicksketch’s picture

quicksketch
he/him
commented
Category: bug » support

I don't think I'll be able to reproduce this problem. It sounds like you're dealing with a lot of custom code for which I can't provide support.

BaskingShark’s picture

BaskingShark commented

I'm doing something similar and the situation is that content loaded via an AJAX request after the initial page load doesn't have the flag links bound to the correct javascript functions. They are just written to the page as plain links with no javascript actions set to occur when they are clicked. The solution is to re-call the function that binds the javascript flag action to the links after they have been loaded.

After you have refreshed the view in javascript, call

Drupal.flagLink();

Make sure that you have loaded the flag.js script for this page -- if there isn't a call to the flag module on the initial page load, that javascript file might not be linked in the page header.

An alternate approach would be to modify flag.js to use the "live" method to attach the flag handler functions to the links... but that's maybe better saved for a future version of the Flag module since it requires jQuery 1.3 or higher.

quicksketch’s picture

quicksketch
he/him
commented

After you have refreshed the view in javascript, call

Drupal.flagLink();

The correct way to handle this is to call Drupal.attachBehaviors() on the new content that has been attached to the page. This is what modules such as Views do when new content is added to the page.

amarnus’s picture

amarnus commented

@quicksketch is right. Drupal.attachBehaviors worked for me. Yep, Views uses the same thing for its Ajax views. Saw that. Let me try Drupal.flagLink() also.

mooffie’s picture

mooffie commented
Status: Active » Closed (fixed)

The original poster says Drupal.attachBehaviors solves his problem, as expected. Let's close this.

vebs0205’s picture

vebs0205 commented

@quicksketch that was a great help... thanks a lot.. u saved my lot of time as I was going to change all my pages to pagination instead of load more.

Thanks!