How to get jQuery to run when ajax auto update runs

Anonymous

#131002

Hi there,

I want to hide the titles of the filter fields when they are empty.

So I’ve wrote out some jQuery that handles this:

jQuery('.searchandfilter > ul > li').each(function() {
	if(jQuery(this).find('ul').length > 0 ) { // if you find a ul
			if(!jQuery(this).find('li').length > 0 ) { // if it doesnt have an li...
				jQuery(this).hide();
			}
	}
});

This is inside a document ready function, so it runs when the page loads. But obviously not when the form is updated (I’m using the ajax auto update).

How would I be able to get this to run when the form updates?

Thank you.

Trevor

#131003

I am not sure, but maybe like this:

<script>(function ( $ ) {
  "use strict";
  $(document).on("sf:ajaxfinish", ".searchandfilter", function(){
    console.log("ajax complete");
    jQuery('.searchandfilter > ul > li').each(function() {
      if(jQuery(this).find('ul').length > 0 ) { // if you find a ul
        if(!jQuery(this).find('li').length > 0 ) { // if it doesnt have an li...
          jQuery(this).hide();
        }
      }
    });
  });
}(jQuery));</script>

That might work.

Anonymous

#131007

Exactly what I needed, thank you!!

Here’s my final code for anyone else with the same idea:

	
jQuery(document).ready(function(){
	search_filter_clean();
});

jQuery(document).on("sf:ajaxfinish", ".searchandfilter", function(){
	search_filter_clean();
});

function search_filter_clean() {
	jQuery('.searchandfilter > ul > li').each(function() {
		if(jQuery(this).find('ul').length > 0 ) { // if you find a ul
				if(!jQuery(this).find('li').length > 0 ) { // if it doesnt have an li...
					jQuery(this).hide();
				}
		}
	});
}

Thanks Trevor.

[Author]

Posts