It's great to have exposed filters to search the view. But, sometimes they are too wide. This sample code shows how to change the search filter display.
In this case, I've changed the width of filter fields and the submit button label.

Put the following code in the end of your theme's template.php file:

/* Change the width of filter fields and the label of the submit button on the 'board' form */
function phptemplate_views_filters($form) {
  if ($form['#view_name'] == 'board') {
    $form['filter2']['#size']=15; 
    $form['filter3']['#size']=15; 
    $form['submit']['#value']='חפש';
  }
  return theme_views_filters ($form);
} 

To change your own fields, simply enable the 'devel' module, print the form values with dprint_r($form), find the values you'd like to change, and change them. Then call the regular callback function to do the rest of the stuff for you.

Enjoy!

Amnon
-
Professional: Drupal Israel | Drupal Development & Consulting | Eco-Healing | Effective Hosting Strategies | בניית אתרים
Personal: Hitech Dolphin: Regain Simple Joy :)

Comments

airali’s picture

...could you please give complete instructions? I can't get what should I do after editing template.php and installing devel module. What does "print the form values with dprint_r($form)" exactly mean? Could you give an example?
Thanks

calebtr’s picture

Amnon, great work!

airali, the example has all of the code you need to change the size of a text box in an exposed view.

Find out the name of your view in Admin -> Site Building -> Views and use that where Amnon uses 'board' (keep the quotation marks).

Instead of using the devel module, you can also find out the name of the form element you want to change by loading your view and looking at the source HTML. Your text field will be named filter0, filter1, filter2, etc, or something.

Prodigy’s picture

Note, the original snippet has hebrew appearing on the submit button, change the 3 letter word to Search or submit, or whatever you need it to say.

grkm2002’s picture

I am trying to change the size of my exposed views filters. I am using drupal 7. Using the code provided I am not sure what to change.
1. Do i replace filter0 with the "filter identifier"/"name=""" required by views or the label name?
2. I am exposing the filter in a views block. Do I use the name of the views-block or the name of the views-page?
Using firebug to expose my html I see tags for:
form id:

I am trying to change size from 60 to 18. I am unable to access the div class.

Rowanw’s picture

This takes the form out of the table and renders it more like a normal Drupal form.

This goes in template.php:

<?php
function phptemplate_views_filters($form) {
  if ($form['#view_name'] == 'MYVIEW') {
  
    $view = $form['view']['#value'];
    $form['submit']['#value'] = 'Search';
    
    $rows_theme = '';
    
    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']) .'</div>';

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

--
How to override HTML in Drupal 6

bgogoi’s picture

this works great.

how to display just the search form and NOT showing the results by default?

It looks like the default selection in the filter fields is set to ...

Rowanw’s picture

The default state of the filters can be configured within the View's settings, although you may have trouble getting the list to be completely empty. You could get more flexibility by loading the filter into a custom block with the following code.

<?php
$view = views_get_view('MYVIEW');
$form = drupal_retrieve_form('views_filters', $view);
$form['#action'] = url($view->url);
drupal_process_form('views_filters', $form);
return drupal_render_form('views_filters', $form);
?>

You'll have to use CSS if you want to hide the original filter form.

Source: http://www.angrydonuts.com/displaying_views_exposed_filters#comment-2424

--
How to override HTML in Drupal 6

achilles085’s picture

How can i achieve this using drupal 6?
I have a view then by default my view displays the fields.
I would like only the filter form being displayed at first,
then display the fields only if user used the filter form.

ncameron’s picture

sunset_bill’s picture

Per the above, what's working for me is doing my exposed filters in a tpl.php file. This is good for complete customization of the exposed filters form, and since it's all HTML, it's good for those who don't know PHP.

For my solution, I've got the 'Exposed form in block' option set to Yes in view settings, and I have the block set to appear only on the front page. So, I copied the HTML for the filters form from View Source into a file called block-views--exp-myviewname-displayname.tpl.php and started rearranging/prettifying the form however I wanted it.

salud...

Anonymous’s picture

Love this solutions! Works perfect, all customized.

xsean’s picture

do you have example or can you explain in more detail?

thanks!

alexkb’s picture

If anyones trying to theme their exposed filters in the old Drupal 4.7, I've adapted Rowanw's code as per below:

function phptemplate_views_filters($form) {

  if ($form['view']['#value']->name == 'MYVIEW') {

    $view = $form['view']['#value'];
    $form['submit']['#value'] = 'Search';
   
    $rows_theme = '';
   
    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 .= form_render($form["op$count"]) . form_render($form["filter$count"]);
      $rows_theme .= '</div>';
    }
      $rows_theme .= '<div>'. form_render($form['submit']) .'</div>';

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

Cheers.

jhoge’s picture

Hi, I tried this in Drupal 6, but there is no key named "#view_name." There's just "#id." I tried using that in template.php but nothing happens at all. Any ideas?

My code looks like this:

function phptemplate_views_filters($form) {
  if ($form['#id'] == 'views-exposed-form-featured-sales-page-1') {
    $form['field_bathrooms_value']['#size']=10;
    $form['field_bedrooms_value']['#size']=10;
    $form['field_neighborhood_value']['#size']=10;
    $form['field_price_value']['#size']=10;
    $form['submit']['#value']='Filter';
  }
  return theme_views_filters ($form);
} 
thomjjames’s picture

Hi,

In Drupal 6 you should use hook_preprocess_views_exposed_form instead, here's a quick example:

function THEMENAME_preprocess_views_exposed_form(&$vars) {
  $form = $vars['form'];
  if ($form['#id'] == 'views-exposed-form-VIEW-NAME-ID') {
    //alter the $form array here
  }
}

More can be found here: http://drupal.org/node/320992#comment-1732960

Tom

______________________________________________
https://tomswebstuff.com

darioshanghai’s picture

If your field name looks like filter1[city] (put anything in place of "city"), you'll need to call it like this:
$form['filter0']['city']['#size']= 30;

dprint_r($form) can be put at the end of the same function in template.php like this:

function phptemplate_views_filters($form) {
dprint_r($form);
return theme_views_filters ($form);
}
putting it into the page.tal.php in any other way didn't work for me.

netentropy’s picture

I keep getting a call to undefined function when I use this

So how do you print_r the array for an exposed views filter

El Bandito’s picture

bjraines

The Devel module must be enabled to use the dprint() function.

Dave

davidbessler’s picture

I am trying to change the number of items visible in a multiselect box. It is longer than the ones next to it, and I want to limit it to 5 items and have it scroll. This is set by
... I cannot, for the life of me figure out how to target that stupid select box. I got the submit button text changed fine:


/**
* Change submit button to search in exposed filters.
*/

function mbpv_custom_functions_preprocess_views_exposed_form(&$vars, $hook) {
  // only alter the search view exposed filter form
  if ($vars['form']['#id'] == 'views-exposed-form-directory-page-2') {
 
       
    // Change the text on the submit button to Search
    $vars['form']['submit']['#value'] = t('Search');
    unset($vars['form']['submit']['#printed']);
    $vars['button'] = drupal_render($vars['form']['submit']);
  }

}

And while we're at it, I have this running in my mbpv_custom_functions.module, how do I get dprint_r() working to print out all the $form array stuff ... I have devel installed and permissions set, but I cannot get the dprint_r to work.

Any help is appreciated.

drecute’s picture

In your views-exposed-form.tpl.php file, do this;

dprint_r($form);

You can place the above like this;

<div class="views-exposed-form">
<?php dprint_r($form);?>
...
</div>
Sumeet.Pareek’s picture

Did exactly what I wanted it to do. Allowed me to quickly change the form submit button text. Thanks for posting it here.

Max_Headroom’s picture

Can somebody tell me why this does not work:

function phptemplate_preprocess_views_exposed_form(&$vars) {

  if ($vars['form']['#id'] == 'views-exposed-form-article-list-panel-pane-15') {
    $vars['form']['title']['#size'] = 90;
    $vars['form']['tid']['#size'] = 5;
    $vars['form']['tid_1']['#size'] = 5;
    $vars['form']['tid_2']['#size'] = 5;
    $vars['form']['type_1']['#size'] = 5;
  }
}

The function is called, the IF statement is true, the variable output (devel dpm) shows that the values has been changed and cache cleared, but it has no affect on the form.

Quentin Campbell

benlawraus’s picture

I used the method outlined here http://drupal.stackexchange.com/questions/21832/increasing-width-of-view...

So in my THEME.css I just placed one line:
#block-views-exp-VIEW_NAME-page input{width: 80px;}
to decrease the width of the field.

valthebald’s picture

Talking about D7, exposed filters is a regular form, so you can theme, preprocess and alter it like other forms
$form_id = 'views_exposed_form', just in case