Newer
Older
<?php
/**
* @file
* Shows how to use the vertical tabs functionality provided by Drupal 7. This
* example does not cover how to save / load custom setting, and only deals with
* elements visibility.
*/
/**
* Implements hook_menu for a simple explanation page.
*/
function vertical_tabs_example_menu() {
$items['examples/vertical_tabs'] = array(
'title' => 'Vertical tabs example',
'description' => 'Shows how vertical tabs can best be supported by a custom module',
'page callback' => '_vertical_tabs_example_explanation',
'access callback' => TRUE,
);
return $items;
}
/**
* Implement hook_form_alter().
*
* Adds custom fieldset to the node form, and attach ajax behaviour for vertical
* panels to update the settings description.
*/
function vertical_tabs_example_form_alter(&$form, $form_state, $form_id) {
// Only include on node add/edit forms.
if (!empty($form['#node_edit_form'])) {
$form['vertical_tabs_example'] = array(
'#type' => 'fieldset',
'#title' => t('Example vertical tab'),
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
'#collapsible' => TRUE,
'#collapsed' => FALSE,
// The #group value must match the name of the vertical tabs element.
// In most cases, this is 'additional_settings'.
'#group' => 'additional_settings',
// Attach the javascript for vertical tabs.
'#attached' => array(
'js' => array(
'vertical-tabs' => drupal_get_path('module', 'vertical_tabs_example') . '/vertical_tabs_example.js',
),
),
'#tree' => TRUE,
'#weight' => -2,
);
// This checkbox is used to show or hide the custom settings form using
// javascript (altering states of a container defined later).
$form['vertical_tabs_example']['enabled'] = array(
'#type' => 'checkbox',
'#title' => t('Use custom configuration'),
'#default_value' => FALSE,
);
// This container will be used to store the whole form for our custom
// settings. This way, showing/hidding the form using javascript is easier,
// as only one element should be set visible.
$form['vertical_tabs_example']['vertical_tabs_examplecontainer'] = array(
'#type' => 'container',
'#parents' => array('vertical_tabs_example'),
'#states' => array(
'invisible' => array(
// If the checkbox is not enabled, show the container.
'input[name="vertical_tabs_example[enabled]"]' => array('checked' => FALSE),
),
),
);
// The string of this textfield will be shown as summary in the vertical
// tab.
$form['vertical_tabs_example']['vertical_tabs_examplecontainer']['custom_setting'] = array(
'#type' => 'textfield',
'#title' => t('Use this custom setting'),
'#default_value' => '',
'#description' => t('This field is a demonstration about how to use Vertical Tabs in your forms. This setting will not be saved.'),
);
}
}
/**
* Simple explanation page.
*/
function _vertical_tabs_example_explanation() {
return t("The Vertical Tabs Example shows how a custom module can best support vertical tabs. To see the effects of this module, look at the <a href='!node_add'>node/add</a> form", array('!node_add' => url('node/add')));
}