Put exposed filters in a fieldset

I'd love to be able to do this too!

Hi!

I had the same issue for my project and I helped out with an override like:

(please change VIEWSNAME and HEADING on your needs)

 function theme_views_display_filters_VIEWSNAME($view) {
  $form = drupal_retrieve_form('views_filters',$view);
  $form['#prefix']='<fieldset class=" collapsible collapsed"><legend>HEADING</legend><div class="form-item" id="filter_VIEWSNAME">';
  $form['#suffix']='</div></fieldset>';
  drupal_process_form('views_filters', $form);
  return drupal_render_form('views_filters', $form);
} 

It workes fine. There is only one problem so far: the status of collapse is not remebered. So if the users leave the page and came back, the filter will be collapsed, even if the user expand it and filter the page. But for me it is usable so far.

The problem I see with your tweak is that the form is contained in the fieldset. Which is not XHTML valid. The fieldset have to be in the form.

You should be able to do this easily enough with a small module and hook form alter.

http://api.drupal.org/api/function/hook_form_alter/5

However I doubt this'd get into 1.x since many people might want the filters not collapsed.

Also note that whether using form_alter or patching, fapi generates fieldsets with collapsible and collapsed settings, you don't need to use #prefix and #suffix
http://api.drupal.org/api/file/developer/topics/forms_api.html/6

Going to leave this open, since a fieldset around the filters (but not collapsed) would make it easier to collapse them in a form_alter

I'm a bit confused. I've implemented the code above, but nothing is clickable for collapse or expansion. Am I missing some code or js somewhere? Is this all that has to be done, or is there something else?

Hi!

I'm looking for the exact same feature. But I can't get it right.

I got so far to have the fieldset appear, and collapse and expand as I want it to. But it comes after the actual form. Why?

I tried with adding a fieldset tag myself. This works, almost, fine. I get a fieldset around the form just as I want to, but it's not collapsed.

This is the code i have in my template.php:

function phptemplate_views_filters($form) {
  if ($form['#view_name'] == 'nyhetsarkiv' or 'artikelarkiv') {
 
    $view = $form['view']['#value'];
    $form['submit']['#value'] = 'Sök';
		$form['view'] = array(
  		'#type' => 'fieldset',
			'#title' => 'Filter',
 			'#collapsible' => TRUE,
		  '#collapsed' => TRUE,
		);
   
    $rows_theme = '';
	  //$rows_theme .= '<fieldset class=" collapsible collased"><legend><a href="#">Filtrera</a></legend>';
   
    foreach ($view->exposed_filter as $count => $expose) {
     
			$rows_theme .= '<div class="filter ' . $form["filter$count"]['#name'] . '">';
      $rows_theme .= '<label for="' . $form["filter$count"]['#id'] . '">'. $expose['label'] .'</label>';
      $rows_theme .= drupal_render($form["op$count"]) . drupal_render($form["filter$count"]);
      $rows_theme .= '</div>';
    }
			$form['reset'] = array(
 			'#type' => 'markup',
  		'#value' => '<input '. drupal_attributes(array('type' => 'button', 'value' => t('Reset') )) .'class="form-submit" 	onClick="window.location = \'' .url($view->url) .'\';" />',
			'#weight' => 19,
  		);
      $rows_theme .= '<div>'. drupal_render($form['submit']).''. drupal_render($form['reset']) .'</div></fieldset>';

   
    return drupal_render($form['q']) . $rows_theme . drupal_render($form);
  }
  else {
    return theme_views_filters($form);
  }
}

Check http://drupal.org/node/296855. That's how I round up doing it.

shawn

I found a solution for this.

The variable $rows_theme, which I use to theme each exposed filter, I set as the value for the $form['view'] variable. So when the $form['view'] is rendered by Drupal the form is included inside the fieldset with the settings declared for $form['view'].

<?php
/* 
 * Theme the filter form for news archive 
 */
 
function phptemplate_views_filters($form) {
  if ($form['#view_name'] == 'nyhetsarkiv' or 'artikelarkiv') {
 
    $view = $form['view']['#value'];
    $form['submit']['#value'] = 'Sök';

//  Reset button
    $form['reset'] = array(
      '#type' => 'markup',
      '#value' => '<input '. drupal_attributes(array('type' => 'button', 'value' => t('Reset') )) .'class="form-submit" 	onClick="window.location = \'' .url($view->url) .'\';" />',
      '#weight' => 19,
    );

    $rows_theme = '';

//  A short explanation on how to use the form
    $rows_theme .= '<p>Använd en eller flera filter för att hitta de du söker efter. För att återställa och visa alla artiklar klicka på Återställ</p>';

//  Theme each exposedfilter
    foreach ($view->exposed_filter as $count => $expose) {
      $rows_theme .= '<div class="filter ' . $form["filter$count"]['#name'] . '">';
      $rows_theme .= '<label for="' . $form["filter$count"]['#id'] . '">'. $expose['label'] .'</label>';
      $rows_theme .= drupal_render($form["op$count"]) . drupal_render($form["filter$count"]);
      $rows_theme .= '</div>';
    }

    $rows_theme .= '<div>'. drupal_render($form['submit']).''. drupal_render($form['reset']) .'</div>';

//  Define settings for the form
    $form['view'] = array(
      '#type' => 'fieldset',
      '#title' => 'Filter',
      '#collapsible' => TRUE,
      '#collapsed' => TRUE,
      '#value' => $rows_theme,
    );
		   	
    return drupal_render($form);

  }
  
  else {
    return theme_views_filters($form);
  }
}
?>

This will not be done in Views 1.

My first entry

as always, in drupal I have many ways to solve problems ;)

I searched for this topic too, but I'm not a geek in php or in drupal (I have my first project in drupal), so I've found a simple (but perhaps dirty) solution for me. I collected some code snippets and read different forums for that. Perhaps it is useful for someone or someone can make a better solution based on mine.

I've copied the views-exposed-form.tpl.php from the views module wich themes the exposed filters, to my theme folder and do the following changes:

after the

<?php endif; ?>

I deleted the rest of the file and replaced it with the following code

<?php

	$content='<div class="views-exposed-form">
  <div class="views-exposed-widgets clear-block">';
  foreach($widgets as $id => $widget) {
	  $content.='<div class="views-exposed-widget">';
	  if (!empty($widget->label)) {
		  $content.='<label>';
		  $content.=$widget->label;
		  $content.='</label>';
	  }
	  if (!empty($widget->operator)) {
	    $content.='<div class="views-operator">';
	    $content.=$widget->operator;
	    $content.='</div>';
		}
	  $content.='<div class="views-widget">';
		$content.=$widget->widget;
    $content.='</div></div>';
	}
  $content.='<div class="views-exposed-widget">';
  $content.=$button;
  $content.='</div></div></div>';

  $element = array();
  $element['#collapsible'] = TRUE;
  $element['#collapsed'] = TRUE;
  $element['#title'] = t('Filter');
  $element['#value'] = $content;
  print theme('fieldset', $element);
  
?>

and it works. Not solution I think, but it works ;)

Perhaps someone has a cleaner or easier solution, I'll be happy.

(sorry for my bad english, I'm from germany) -- seen to late, my solution works on drupal 6.x, don't know if also for 5.x

Well. to me it looks like this is the best easy solution.

One thing, though:
If you have an exposed filter on a 'number' field, that exposed filter needs to be post-processed by JavaScript. (Some textboxes need to be made invisible, because 'less/more than' has one textbox and 'in between' has two.)
This fails when the textboxes are in a collapsed fieldset.

The solution: make it non-collapsed and include some JS to collapse the fieldset at the very end:
$element['#collapsed'] = FALSE;
drupal_add_js("$(document).ready( function () { Drupal.toggleFieldset($('#SOME_IDENTIFIER fieldset')); });", 'inline');

I created code where the filters are only put in the collapsed fieldset if they have no values, i.e. you always see the already-filled filters:
http://drupal.org/node/682014

Attached is the entire "views-exposed-form.tpl.php" template file for Views 6.x-2.x, with the changes from reply #10, but with cleaned up code (to validate against Coder) and with the fieldset's default state set to expanded. Works fine for me!

But this is not a patch, right?

With pluggable exposed forms you could make a plugin which does this.

No, it's not a patch. The file inside the attached .zip archive is meant to be a replacement of the shipped views/theme/views-exposed-form.tpl.php file of Views 6.x-2.x. Being able to collapse the exposed filters above the views results is essential if you have more than let's say maybe 3 exposed fields, and it doesn't harm at all. Just a must-have for me and I think many others.

What i missed to say: You don't have to replace the existing one: copy your new tpl to your theme. Thats it.

Yeah, that's exactly the way I did it. Nevertheless, I still consider it as an advantage if that template would ship with the Views package per default.

If you want this... make a patch

Here it is. Thanks for considering it!

I wouldn't implement it this way... I suggest to add a new exposed form plugin

Sorry, but I'm not used to Views plugins - so I can't do your suggested solution at this time. Maybe someone with good expertise in this field (it seems that are you...) may want to do that.

Sorry, I am not going to make exposed features be in a fieldset by default.

I am sure that it is a must have for you, and you've found a way to do that. That is excellent and I am happy that you have done it. But that is not how exposed filters are used the vast majority of the time, and that is not something I will do by default.

That is 100% fine to me - so people who want the fieldset just need to grab the ZIP file attached to #12, and put its content into the default theme directory.

Is it possible to group some fields into collapsable fieldsets and other leave outside the fieldset?

It's possible. See link and last sentence in comment #11 above, for an example, which puts only the 'empty' fields into a collapsible fieldset.

Great man..works well for me. thanks so much...you dont know how much this saved me!

For those who prefer to use a preprocess function, here is another solution:

<?php
function MYTHEME_preprocess_views_view(&$vars) {
  // Wrap exposed filters in a fieldset.
  if ($vars['exposed']) {
    $element = array(
      '#title' => t('Filter'),
      '#collapsible' => TRUE,
      '#collapsed' => TRUE,
      '#value' => $vars['exposed'],
    );
    $vars['exposed'] = theme('fieldset', $element);
  }
}
?>

This last solution (preprocess) worked perfectly for me in D6 but not in D7. I've tried a few things but with no success. Any suggestions...?
Thank you!

@cajmcmahon:
This issue is marked as applying to 6.x-2.x-dev.
You should post any request applying to 7.x separately.

Posted separate D7 issue here: - http://drupal.org/node/1224284

D7 Wrap views exposed filters in fieldset

http://drupal.org/node/1224284#comment-4946712

Another interesting and effective approach would be to put in a block the exposed filters, and then use block visibility to control where and when the exposed filter would show up, and some modules like Collapsiblock http://drupal.org/project/collapsiblock to control the status of the module collapse.
Over the theme preprocess approach, this will apply just where and when you'll need it, and you'll even be able to control the initial status of the collapse (open/collapsed).

Was this "feature" included at some point by default in Drupal Commons? I'm building my first Commons site, and exposed filters are inherently implemented this way (with a collapsible fieldset set to collapsed by default with no apparent way to change that default). I think it is very unintuitive to have the word "Filters" just sitting at the top of the page and would really like to just show my exposed filters the old fashioned way.

I've looked at views-exposed-form.tpl.php within the /sites/all/modules/views/theme folder, and it doesn't even contain the word "collapsible" or "filter" so I'm not able to simply edit this file.

Any suggestions are very much appreciated.

tbrowninfinitymark: see http://drupal.org/node/1460198 if you're still in need of answers to how fieldsets are implemented in Drupal Commons.

#27 anrikun. The code you provided will change all Views. How can I set that code for specific Views only? For example, I wanna use this on ViewsA only.

@CocoSkin,
You might be able to do something like this in a small module, if it's an exposed form:

function HOOK_form_views_exposed_form_alter(&$form, &$form_state) {
	$form_name = $form_state['view']->name;
	if ($form_name=='my_exposed_form') {
		...
	}
}