Making a Grouping Field and its contents collapsible (Views) [#1169632]

For D7 check #4 This solution is for D6.
This is how you make a Grouping Field and its content collapsible:

Go the configuration of the View on which you want to apply this method.
After clicking Theme: Information ("Basic Settings" box), click on "Style output".
Copy paste the provided code, and save it in your theme folder as "views-view-unformatted.tpl.php" or another filename as suggested next to the Style output link.

The code you just pasted looks like this:

<?php
// $Id: views-view-unformatted.tpl.php,v 1.6 2008/10/01 20:52:11 merlinofchaos Exp $
/**
 * @file views-view-unformatted.tpl.php
 * Default simple view template to display a list of rows.
 *
 * @ingroup views_templates
 */
?>
<?php if (!empty($title)): ?>
  <h3><?php print $title; ?></h3>
<?php endif; ?>
<?php foreach ($rows as $id => $row): ?>
  <div class="<?php print $classes[$id]; ?>">
    <?php print $row; ?>
  </div>
<?php endforeach; ?>

Modify this code to this (copy paste it if you like):

<?php
// $Id: views-view-unformatted.tpl.php,v 1.6 2008/10/01 20:52:11 merlinofchaos Exp $
/**
 * @file views-view-unformatted.tpl.php
 * Default simple view template to display a list of rows.
 *
 * @ingroup views_templates
 */
?>

<?php drupal_add_js('misc/collapse.js', 'core'); ?>

<fieldset class="collapsible collapsed">
    <legend class="collapse">
		<?php if (!empty($title)): ?> 	
            <a href="#"><?php print $title; ?></a>
        <?php endif; ?>
    </legend>   
    <?php foreach ($rows as $id => $row): ?>
        <div class="<?php print $classes[$id]; ?>">
        <?php print $row; ?>
        </div>
    <?php endforeach; ?>
</fieldset>

And you should be ready to go. The displayed View should like this now:

Grouping Field 1 (expanded after mouseclick)
- Title linked to node 1
- Title linked to node 2
- Title linked to node 3
Grouping Field 2 (collapsed)
Grouping Field 3 (collapsed)

Comments

Comment #1

9 June 2011 at 14:02

Status:

Fixed

» Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

Comment #2

knalstaaf CreditAttribution: knalstaaf commented 28 October 2011 at 07:10

If this looks like too much work for you, the Views Accordion module may catch your interest.

Comment #3

josephcheek

Provo, UT

CreditAttribution: josephcheek commented 10 August 2012 at 20:52

Unforch, views accordion won't allow a field that is being grouped to be collapsible. If it did, that would solve my problem, but it looks like this template will work for me.

Thanks!

Joseph Cheek

Comment #4

jibran

he/him

Urdu

Sydney, Australia

CreditAttribution: jibran commented 25 October 2012 at 23:36

Version:

6.x-2.12

» 7.x-3.5

This works in D7

/**
 * Display a single views grouping.
 */
function mytheme_views_view_grouping($vars) {
  $view = $vars['view'];
  $title = $vars['title'];
  $content = $vars['content'];

  $output = theme('ctools_collapsible', array('handle' => $title, 'content' => $content, 'collapsed' => TRUE));

  return $output;
}

Comment #5

rachelf CreditAttribution: rachelf commented 6 January 2013 at 22:05

This is another way for D7:

Follow the original instructions, but copy and paste the code below into views-view-unformatted.tpl.php

<?php
// $Id: views-view-unformatted.tpl.php,v 1.6 2008/10/01 20:52:11 merlinofchaos Exp $
/**
* @file views-view-unformatted.tpl.php
* Default simple view template to display a list of rows.
*
* @ingroup views_templates
*/
?>

<?php drupal_add_js('misc/form.js'); ?>
<?php drupal_add_js('misc/collapse.js'); ?>
 
<fieldset class="collapsible collapsed">
  <legend><span class="fieldset-legend"><?php if (!empty($title)) : ?><?php print $title; ?><?php endif; ?></span></legend>
<div class="fieldset-wrapper">
<?php if (!empty($title)): ?>
            <a href="#"><?php print $title; ?></a>
        <?php endif; ?>
    </legend>  
    <?php foreach ($rows as $id => $row): ?>
        <div class="<?php print $classes[$id]; ?>">
        <?php print $row; ?>
        </div>
    <?php endforeach; ?>
</div>
</fieldset>