5

Using the form api to create a fieldset:

$form['fieldset'] = array(
 '#title' => 'title',
 '#type' => 'fieldset',
 '#collapsible' => TRUE,
 '#description' => 'desc',
);

Drupal will output:

<fieldset class="collapsible form-wrapper collapse-processed" id="edit-fieldset">
  <legend>
    <span class="fieldset-legend">
      <a class="fieldset-title" href="#">
        <span class="fieldset-legend-prefix element-invisible">Hide</span>
         title
      </a>
      <span class="summary"></span>
    </span>
  </legend>
  <div class="fieldset-wrapper">
    <div class="form-item form-type-textfield form-item-testelement">
      <label for="edit-testelement">asdf </label>
      <input type="text" id="edit-testelement" name="testelement" value="" size="60" maxlength="128" class="form-text">
    </div>
  </div>
</fieldset>

The #title in the form array will be the <a> you click on to expand the fieldset. I want to put text in the <span class="summary"></span>, which puts additional, non linked text beside the title. I can't seem to do this with the form api, as #description will only put text within the fieldset that is hidden when it is closed.

What's the easiest way to do this?

2 Answers 2

3

See vertical_tabs_example_form_alter(), there it's written:

Vertical tabs provide its most usable appearance when they are used to include a summary of the information contained in the fieldset. To do this, we attach additional JavaScript to handle changing the summary when form settings are changed.

  '#attached' => array(
    'js' => array(
      'vertical-tabs' => drupal_get_path('module', 'vertical_tabs_example') . '/vertical_tabs_example.js',
    ),
  ),

In vertical_tabs_example.js it then goes on like so:

Use the fieldset class to identify the vertical tab element. Depending on the checkbox status, the settings will be customized, so update the summary with the custom setting textfield string or a use a default string.

$('fieldset#edit-vertical-tabs-example', context).drupalSetSummary(function (context) {
  if ($('#edit-vertical-tabs-example-enabled', context).attr('checked')) {
    return Drupal.checkPlain($('#edit-vertical-tabs-example-custom-setting', context).val());
  }
  else {
    return Drupal.t('Using default');
  }
});
-1

I am looking to do something similar, setting a summary in a manually output collapsible fieldset.

I looked into the collapse.js where it is defining the collapse behavior (line 56 of /misc/collapse.js).

At line 70, It looks like it is pulling the summary text from $.fn.drupalGetSummary().

I am not 100% on this (since it doesn't appear to mention in the Form API docs), but from looking at source codes, I think it might do the trick if you add to your array an entry for

'#summary' => "This is my fieldset!",

Other things you could experiment with:

'#summary callback' => 'my_module_example_fieldset_summary',
'#summary arguments' => array('bar'),

and you would probably need to define the summary callback in a module...

function my_module_example_fieldset_summary($foo){
  return t("foo is ".$foo.".");
}

or maybe you could just use something simple like:

'#summary callback' => 't',
'#summary arguments' => array('foo is bar.'),
1
  • $.fn.drupalGetSummary() is a JavaScript function; it cannot call any PHP function.
    – apaderno
    Sep 27, 2013 at 5:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.