Collapsible Fieldsets
What it is
Makes use of Drupal's collapsible fieldsets for use on your custom forms. There are 2 states that can be specified when the page loads, collapsed and expanded.
How to use it
- In your custom forms, break the fields into sections with the
<fieldset></fieldset>object. - Place the following scrpt references in your page. You may have to put in absolute URLs.
- For the fieldsets that you wish to be collapsable, add
class=" collapsible"within the fieldset brackets (see example below) - If you want the fieldset to be collapsed, add
class=" collapsible collapsed"instead - You may need to put in the
< ! --break-- >tag above the form so it doesn't muck up your template when the page is in 'teaser' view.
<script type="text/javascript" src="/misc/drupal.js"></script>
<script type="text/javascript" src="/misc/collapse.js"></script>Example form
<script type="text/javascript" src="/misc/drupal.js"></script>
<script type="text/javascript" src="/misc/collapse.js"></script>
<form name="form1" method="post" action="www.site.com">
<p>
<fieldset class=" collapsible"><legend>Collapsible</legend>
<table>
<tr>
<td>Name:</td>
<td><input type="text" name="name" value="<?php
global $user;if($user->uid) { print check_plain($user->name);}?>" ></td>
</tr>
<tr>
<td>Email: </td>
<td><input type="text" name="email" value="<?php
global $user;if($user->uid) { print check_plain($user->mail);}?>" ></td>
</tr>
</table>
</fieldset>
<fieldset class=" collapsible collapsed"><legend>Collapsed</legend>
<table>
<tr>
<td>Name:</td>
<td><input type="text" name="name" value="<?php
global $user;if($user->uid) { print check_plain($user->name);}?>" ></td>
</tr>
<tr>
<td>Email: </td>
<td><input type="text" name="email" value="<?php
global $user;if($user->uid) { print check_plain($user->mail);}?>" ></td>
</tr>
</table>
</fieldset>Drupal 5
With the new PHP form API (FAPI), collapsible forms can be easily created:
<?php
$form['contact'] = array(
'#type' => 'fieldset',
'#title' => t('Contact settings'),
'#weight' => 5,
'#collapsible' => TRUE,
'#collapsed' => FALSE,
);
?>See the FAPI reference.
Drupal 5
Couldn't find an example of this anywhere, so here's one.
To create a fieldset containing a number of fields, do the following in hook_form():
Create a form element of type 'fieldset'.
The items to go in that fieldset are created as children of the fieldset item:
//Hide various sections of the form in expanding fieldsets.
//This is done by creating a "fieldset" element on the form, then
//putting the items you want to be in the fieldset as subarrays of that element.
$form['myfieldset']= array(
'#type' => 'fieldset',
'#title' => t('Click Me to Expand'),
'#weight' => 1,
'#collapsible' => TRUE,
'#collapsed' => True
);
$form['myfieldset']['field01'] = array(
'#type' => 'file',
'#title' => t('Upload File'),
'#description' => "",
'#required' => FALSE,
'#weight' => 1
);
$form['myfieldset']['field02'] = array(
'#type' => 'textfield',
'#title' => t('Enter Text'),
'#description' => "",
'#required' => FALSE,
'#weight' => 1
);