Drupal 7 Better Exposed Filters

By shane
Tue, 2012-11-13 22:23
6 comments
Daily Dose of Drupal Episode #49

Learn how to use the Drupal 7 Better Exposed Filters module to enhance the exposed filters of your Drupal Views.

Note: The sound clips off after about 5:50 in this video. You can still see the quick demonstration of the checkboxes of the Better Exposed Filters module.

In this episode you will learn:

  • How to use the Better Exposed Filters module to change multiple select filters to checkboxes.
  • How to use the Better Exposed Filters module to add a description and a collapsible fieldset around an exposed filter

Welcome to another Daily Dose of Drupal everyone! I’m Shane and as always you can follow me on Twitter @smthomas3 or you can go ahead and find me on Google + or you can hop over to the codekarate.com website and sign up for the newsletter.

Today we’re going to be talking about the Better Exposed Filters Module; and this is a cool little module especially if you used the Views Module often and you use Exposed Filters with Views.

Let’s take a look at what it can do; one of the things it can do is it can allow you to use checkboxes instead of a multiple select box and this is helpful because believe it or not a lot of users don’t understand you can control and click or use the Control button or Command button and click Multiple Options in a Select box.

So what this is going to allow you to do is use checkboxes to make it easier to select multiple things, it also adds some Ajax type things, it allows you to use scrollable checkbox or radio list, add Help text for each filter and use a JQuery slider for greater than, less than or in between filters.

So it’s pretty cool; let’s go ahead and take a look at it; we have a test site up here and what I’m going to do is I’m going to start by downloading the Views Module. So the first step is going to be just building a simple View, I’m going to enable the Views and the Views UI module and as soon as that’s good to go I’m going to hop up here and click on Structure, click Views and we’re going to create a simple View so we’re going to add a new View; so we’re going to call this Filters Test.
So we’re going to show content of type all, I will go ahead and create a page and we’re going to create … we’ll just go a table format to keep things easy, we can show 10, that’s fine and we’ll go ahead and continue and edit. So as we look down here we can see that we have a couple of pages of different types so we’re going to add a field and we’re going to go ahead and say Content Type and we’ll leave everything else to default so now it shows the title with a link and of the type of content.

We’re going to now add a Filter Criteria and we’re going to add Content Type in there and we’re going to click here; this is the important part; Exposes Filter to Visitors, allowing them to change it and we’re going to hit Single and we’re going to hit As one of and we’ll go ahead and hit Allow Multiple Selections, we’ll go ahead and leave it at that, click Save.

As you can see now you can select Multiple using the CTRL key and if you hit Apply it will filter it based on your selections or we really want those … we want those checkboxes here to make it a little bit easier and that’s where the Better Exposed Filters Module comes in.

So let’s go ahead and use Drush to download this, so we’ll download it and enable it, so we have that module ready to go, we’ll go ahead and hop over to the modules page and I’m going to hop back and make sure I save my View first and let’s go ahead and open this in a new tab and we’ll take a look at the Better Exposed Filters Module which is down here at the bottom, you can see it’s turned on, we’re using the 7.x-3.0-beta 3 version, you’ll also notice that it requires C tools which is required by Views so that’s where that requirement come from.

So the next step; we’ll come back into our View’ we have this View that we’ve been working in so we’ll click Edit and we’ll go into this Exposed Filter here. So you see you don’t notice anything different here, however if we go over to the actual page; and so if you actually go to the page you’ll still see that it actually still as a Select; what you need to do is you need to come over into this Advance section here and you click on the Exposed Forms Style and this is going to let you change what type of Exposed Form you have on your View, you’re going to select Better Exposed Filters here, hit Apply and now you can get going on changing some of these settings.

And this is pretty typical of normal filters and there’s an Auto Submit button which is new in Drupal 7 and the Better Exposed Filters actually allows you to do this in the Drupal 6 version I believed but you can have an Auto Submit and hide this Submit button and that’s part of Views. Here’s the Exposed Filters setting that Better Exposed Filters allows you to do; you can use a default select list [inaudible]Add to Cart.

Need to learn more Drupal?

Premium Drupal Training Online (Horizontal)

Comments

Hi,

is it just me, or is something wrong with the sound at the end of that screencast?!

Regards,

Tobi

My apologies for the sound issue on this one everyone. Hopefully it is still helpful. Since it is pretty close to the end and you can still view the module in action I won't be uploading new audio for this one. Will make sure I watch for this issue in the future.

Thanks for watching the Daily Dose of Drupal.

Thanks for the overview, this helped me while i was looking for auto-submit functionality.

Can you explain what you are trying to do? I might be able to help you if you provide some additional information. Have you tried enabling "Ajax" on the view to see if that does what you are asking for?

Post new comment