drupal > views > exposed filter > submit on change

sprugman picture sprugman · Sep 28, 2009 · Viewed 10k times · Source

I've got a view with a single exposed filter (a select). It's using ajax to re-populate when the user clicks "Apply". I'd like them not to have to click that and just re-populate when the select is changed. I'm assuming I'm going to need some JS more or less like this (though this doesn't quite seem to be working):

$('#edit-tid').change(function(){
  $('#views-exposed-form-MYVIEW-page-1').submit();
});

First, I would think that would do it, but it's not getting submitted. Anyone know why?

Second, what's the best way to inject that code? I'm thinking of using the View footer because it's easy, but any other better ideas?

UPDATE: The above code is working (injected via the views footer), but only the first time. I guess the select is getting overwritten by the ajax call, but the behavior isn't getting reattached (or something). Hmm...

UPDATE #2: For simplicity's sake, I'm gonna ditch the ajax.

Answer

jhedstrom picture jhedstrom · Sep 28, 2009

In order to have this code re-attached after the ajax call, it should initially be attached via Drupal.behaviors. Something like this:

Drupal.behaviors.myCustomModule = function(context) {
  $('#edit-tid', context).change(function(){
    $('#views-exposed-form-MYVIEW-page-1').submit();
  });
}

Note that the context argument is passed into the selector. Drupal.behaviors should get called again on the new content loaded via ajax.

Update: I didn't notice you were inserting the js via the views footer. The above should still work, just replace 'myCustomModule' with some unique identifier so you don't override other behaviors.