Solution: Using AJAX with Drupal Views' Better Exposed Filters Module

You have a view listing nodes on your Drupal website and wish to use Better Exposed Filters as links that load in AJAX (perhaps inside a panel pane). Sounds simple? It should be. But ...

Click here for the but.

The problem is that AJAX doesn't work in panes when using the BEF module if the filters are exposed as links. There is a patch on its way to the main module, but in the mean time, I have solved this issue by doing the following:

1) Select Better Exposed Filters
2) Under BEF Settings, select checkboxes/radio buttons
3) Add some CSS to hide the radio button circles and style your filters

Now, it's not "links" but it functions the same.

Sample CSS:

.bef-select-as-radios .form-radio {
    display: none;
}

.bef-select-as-radios .form-item {
    display: inline-block;
    color: #ff0000;
    margin-right: 10px;
}

.bef-select-as-radios .form-item:hover, .bef-select-as-radios .form-item:focus {
    color: #ffff00;
    cursor: pointer;
}

Originally posted here.

Filed Under:

  1. Drupal
  2. Drupal Better Exposed Filters
  3. Drupal Modules
  4. Drupal Views
  5. AJAX
  6. Drupal Panels
  7. Drupal Planet