Hi

I have a view that uses the date field with the calendar popup.
It works as expected. [And thank you for that!]

There is now a requirement to use a barrel style date selector on the mobile version of the site, to do this i have used the context module with device detection and cloned the view. On desktop the original view is used.
On mobile version of the view, the date field is left as just text and I have added a block that contains some drupal_add_js statements that add the custom date picker to the date fields.
This block is only applied on mobile version.

When the page initially loads, the custom date picker works as it should.
When the exposed filters are applied and the view is updated via ajax, then the custom date picker is removed and this is where I have run into a brickwall. I had hoped that using something like:

(function ($) {
    $(document).ajaxStop(function() {
        console.log('ajax is done');
    });  
}(jQuery));	

I would get a console message once the view ajax calls have competed, but I am not getting anything!

If I remove the ajax option, I loose the exposed filters.

This is also posted in the post installing forum: https://drupal.org/node/1935060
sorry for the [edited] cross post, I am not sure where the best place for it would be.

Thank you for your help
ice70

Comments

merlinofchaos’s picture

Status: Active » Fixed

Your code is using an abbreviation of jQuery.ready() which only works upon initial page load. What you need to use are Drupal's 'behavior' system, which is called after most ajax changes to the pages. You can do a search for Drupal behaviors and find the proper syntax.

merlinofchaos’s picture

Sorry, that isn't ready() you're using; however, behaviors are still the way to go. :)

ice70’s picture

Hi Merlinofchaos,

THANK YOU!!!! That was diving me nuts! :)

You help is greatly appreciated.

If anyone else is running into this, what i ended up doing was

Drupal.behaviors.myBehavior = {
  attach: function (context, settings) {
   //your code here
  }
};

which I got from:
http://drupal.org/node/171213#comment-5327990

Once again, thank you!
ice70

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

ajwn’s picture

I have added this in and works perfectly, thanks for this.
Now I have a view that uses ajax, and will execute my lil jQuery after the refresh.

maazzarif’s picture

Issue summary: View changes

@ice70 thanks for this code. It works even after the ajax call. But, Its raising some problems for me.
I have written a code that creates anchor and div elements dynamically. The problem is that these dynamically added elements are repeated number of times automatically. Instead of one div/anchor tag I am getting six of them. Any help.

ice70’s picture

@maazzarif at a rough guess, it may be down to the code getting called 6 times, or there is an error in how the tags are created.
Try doing a console.log() to get something useful back to narrow down which it is. For example try a timestamp - console.log($.now()) [i think] - if appears 6 times and is a different timestamp for each, then the code is getting called 6 times and you will want to look at how you are calling it. If it is there only once, then you will need to look at how the tags are made. good luck!

maazzarif’s picture

@ice70 thanks for your response. However, after a bit of searching and being fortunate I got the solution to this known problem of drupal.behavior function. This function keeps on executing the js code in some cases due to some type of ajax calls. However, Drupal 7 has provided us with a jquery.once plugin as a solution to it. Got the solution here.

ice70’s picture

@maazzarif nice one! Glad you got it sorted :)
Thank you for putting up the solution as well.
Have not needed to use jquery.once but will hopefully remember about it when I no doubt end up with a similar problem :)