Make Apply button redundant (instant filter)

This is best done at the theme level, rather than as an addition to this module:

In your view, under the "Basic settings" section set AJAX to "yes". Add the following JavaScript to your theme. This is best done with in a custom JavaScript file, but could be done using drupal_add_js() from your theme's template.php file in a pinch.

Drupal.behaviors.live_filter = function() {
  // Hide the apply button.  Hold the jQuery object for use later 
  var apply = $('.views-exposed-widget input.form-submit');
  apply.hide();
  
  $('.views-exposed-widget input').change(function() {
    apply.submit();
  });
}

This code assumes there is only one set of exposed filters on the page. The wait cursor will appear where the Apply button used to be.

Another option is the Views Live Filters module. But as of this writing the project page says the module is "still experimental and not yet suitable for production sites."

I've added this to the BEF handbook page.

Hi, thanks for BEF. I tried the js above and I find that it doesn't submit the form. Applying submit() to the form element itself worked ok. Also, this js doesn't work for the Select All links. So if you run the above js and hide the Apply button, the Select All links won't submit the form.

It looks like changing a form elements value via attr() doesn't trigger that elements change event. I've added code to BEF to trigger it manually. Try the latest -dev release to grab it.

Re: the above code not working correctly, I'm not sure what changed, but calling submit() on the submit button was never supposed to work. The correct code should be:

Drupal.behaviors.live_filter = function() {
  // Hide the apply button.
  $('.views-exposed-form input:submit').hide();
 
  // When the change event fires, run the submit handler
  $('.views-exposed-form input').change(function() {
    $(this).parents('form').submit();
  });  
}

I've updated the handbook page to reflect this.

Thanks for the response. The snippet above works fine and is an improvement on the original code.

The dev version changes lead to an infinite loop (at least in Firefox and Chrome) after clicking 'Select All'. I haven't checked in detail but it looks like the form continually submits.

I'm not able to repro you infinite loop issue on FF 3.6.3 or Chrome 5.0.375.55.

Double check that "Items to return" on the view in question isn't set to 0 and that "Distinct" is set to Yes. Those will both limit the size of the return payload and a huge return payload might be looking like an infinite loop?

When AJAX is turned on in the view, you'll get a spinning wait icon when the submit happens. How many wait spinners are you seeing?

Thanks.

Also, if none of the above seem likely candidates, please post an export of the View in question. Thanks.

Thanks for the response. I think I've isolated the issue to these lines in better_exposed_filters.js

// If all checkboxes are already checked by default then switch to Select None
        if ($('input:checkbox:checked', this).length == $('input:checkbox', this).length) {
          newLink.click();
        }

On load, these lines attempt to set the correct state for Select All/Select None but by simulating a click they trigger a submit of the filter. I think we need a way to set the toggle state without submitting the form.

In better_exposed_filters.js, try

-          newLink.click();
+          newLink.html(selNone);

I wrote a exposed form plugin which uses ctools.

http://github.com/dereine/Views-autosubmit-exposed_form

I could write a patch for this module which allows this as option for the 2.x
This would be a perfect method to move issues from views to better exposed filters :p

Not sure why it hasn't had much recognition, but there's an awesome catch-all views module that does just this (even with text fields on unfocus):
http://drupal.org/project/views_hacks

It's the Views Filters Auto-submit submodule

Cheers!

Oh, and there's also a really nifty module that filters options out of the select list when there are zero relevant rows in the result set!

Interesting alternatives. I'll check out Views Hacks and if that doesn't work then the theme solution.

A follow-up: the Views Filters Auto-submit works, but not with the Select All link. I guess you can't blame Views Filters Auto-submit since this is a very special case for Better Exposed Filters.

Cool. Thanks Adrian. Anyone know whether this could be patched easily on either end?

+1 subscribing - having this feature ship with Better Exposed Filters would be AWESOME
Thanks

Marked #880966: Instant filter: per FILTER and SORT settings a duplicate of this feature request.
A per Filter and per Sort settings granularity would be great!

Is there a chance this will make it into the module? As a per exposed filter setting would be awesome!

Sorry guys, am I missing something? To the people who are still +1'ing this, does View hacks (mentioned above), not supply this feature already? And if it doesn't do something that you'd like to see, I might suggest bringing it up in their issue queue?

I guess I'm just not sure if there's a good reason to duplicate auto-submit functionality in two modules... but maybe I'm misunderstanding

Views hacks doesn't allow this as a per exposed filter option. Also, it be better to have this shipped in the Better Exposed Filters module instead of Views Hacks I feel as it has to do with exposed filters only and there has been great developments here.

Gotcha... Per filter settings are something that Views Hacks doesn't currently offer, so it's a as good a reason as any to branch like this.

But what happens when someone has a select list that they don't want BEF to work on, but they do want auto-submit. Or what if they don't want traditional BEF features at all (the radios and checkboxes), but still want auto-submit. Does it still make sense to focus development of auto-submit in BEF? Auto-submit applies to any exposed filter (perhaps a noderef filter or a date widget or something else), and not particularly an exposed filter that someone wants modified in the way BEF does.

So does auto-submit deserve to be packaged with BEF, or should dev focus be elsewhere? I personally don't know, because I'm not familiar with BEF code, but I think it deserves some consideration :)

For what it's worth, infojunkie, the maintainer of View Hacks, is ready to review and commit patches if anyone wants to contribute to a more general functionality to View Hacks.
#956180: Activate auto-submit on a per filter basis

@patcon #20: Look at what I wrote in #15, Views Filters Auto-submit does not work on Better Exposed Filters' special "Select all".

@AdrianB, sorry, I didn't fully get that when I wrote #20, but I clued in later. Anyhow, I'm new to contributing, but isn't the way that this place works that you file an issue with the maintainer of the previous (and more general purpose) effort, not create your own niche functionality in another module.

I understand that a temporary stopgap is sometimes that way to go, but shouldn't improving Views Hacks ideally be the next step, not petitioning for this to be committed to BEF?

Anyhow, I'm up for taking a stab at it when things die down with work.

In IE7 and IE8 the auto-submit only happens after clicking once on the option input and then again elsewhere on the page off the input.

I haven't looked at the JS, but I'm assuming the onChange event is handled differently?

Sorry, which auto-submit module were you referring to josh? I know this queue is for BEF, but there was some back-and-forth on another... I think BEF is onKeyup, and view_hack auto-submit is onChange or on... on.... whatever the opposite of focus is... -- Oh yeah: onBLUR!

I imagine either could be changed pretty easily if someone dove into it :)

#26, it is, you need some code like

  var evt = $.browser.msie ? "click" : "change";
  $("my selector").bind(evt, function () { ... }

Could someone please provide a patch that could be applied to BEF module?

I would love to see this feature for BEF as well!

Amazing code thanks heaps for contributing this... also the following code works great for select fields. :)

 $('.views-exposed-form select').change(function() {
        $(this).parents('form').submit();
 });

Here's a patch for the fix in #28. I'm not sure if the .click() at the end of the .js file also needs to be changed...

@32 the click/change thing is only needed for select elements AFAIK

Don't think so, I needed it for radio buttons and checkboxes...

I have some hesitations to committing #32 as it's a workaround for a jQuery bug that is fixed in jQuery 1.4. Committing this would kill keyboard accessibility on IE for those that have updated jQuery themselves. Then again, usability is pretty broken on IE without this fix. Then again again, there are a lot of people that have updated to jQ 1.4 for the performance benefits...

I'm open to arguments one way or the other on the patch in #32. I should note that this is not related to the per-filter option mentioned earlier -- I would like to add that but haven't had the time to work on it.

Maybe there's a way to check the version of jQuery and branch the code based on that? I'm just thinking out loud here as I need to dash off to the DrupalCon opening party! <grin>

(Note: I'm using the term "bug" loosely here -- the purpose of a framework is supposed to save us from details such as how IE bubbles vs. Firefox. The real bug is that IE bubbles events differently than other browsers. Just in case someone had their flamethrower at the ready...)

@20: views hacks currently fail with IE and multiple filters. (Yes I hate IE). Trying this.... nope... nothing works with IE. Guess I'll be writing some .js in the morning...

Maybe not:
http://drupal.org/node/1145330

It seems that the auto-submit functionality has been introducted into latest Views dev: http://drupal.org/node/1058370#comment-4424394.

But it doesn't work with BEF if checkboxes are chosen...

I'm closing this as won't fix, mostly because of the reasons in #35. As far as I can tell, the select all/none links work as expected on IE8 and up -- I don't have access to IE7 at the moment, but if there is an issue there, please open a separate, IE7-specific issue for it.

The issue mentioned in #37 has been moved for better tracking: #1155920: BEF needs to respect Views' new auto-submit functionality. Note: that's a D7-only issue.

All the other problems with IE (#26 and the solution in #28) are theming issues -- that code is not supplied by this module but instead is from the documentation. If someone has the chance to update the docs, it would be much appreciated! If not, I'll try and get to it after the next 6.x release.

If anyone isn't happy with this resolution, please reopen and argue your case.

Thanks.

I'm not sure this solved the problems we encountered above, but since we found another solution and went with it (one of *those* projects), no issue from this side. Thanks.

personal tag: GCA

I am using the Views Filters Auto-submit submodule, and it works fine. For some reason I do have to set Ajax to "No" in my View, otherwise it won't work.