A Drupal form select/options field example (dropdown box)

Drupal form FAQ: How do I create an HTML SELECT/OPTIONS field in a Drupal form?

Solution: If you'd like to create an HTML SELECT field (a dropdown box) in a Drupal form that looks something like this:

A Drupal 7 form SELECT OPTIONS field example

there are at least two ways to do so.

Use a one-dimensional array

In the first approach, you can just use a one-dimensional array to define your OPTION values, like this:

$form['crust_size'] = array(
  '#title' => t('Crust Size'),
  '#type' => 'select',
  '#description' => 'Select the desired pizza crust size.',
  '#options' => array(t('--- SELECT ---'), t('10"'), t('12"'), t('16"')),
);

In that code, the array that looks like this:

array(t('--- SELECT ---'), t('10"'), t('12"'), t('16"'))

defines the dropdown options. Note that the Drupal field type is defined as select. I often refer to this as a dropdown menu or combobox, but technically it's an HTML SELECT/OPTIONS field.

An important note here is that this is a one-dimensional array, and so the keys for the three options shown will be '0', '1', '2', and '3'. As a result, the HTML source code that will be rendered by this Drupal form SELECT field will look like this:

<select id="edit-type" name="type" class="form-select">
  <option value="0" selected="selected">--- SELECT ---</option>
  <option value="1">10</option>
  <option value="2">12</option>
  <option value="3">16</option>
</select>

If you want to control those option values, read on.

Controlling the option keys

To control the option values (the keys) that are rendered with your SELECT field, all you have to do is specify a key/value PHP array, something like this:

# the values for the dropdown box
$form['type_options'] = array(
  '#type' => 'value',
  '#value' => array('APPLICATION' => t('Application'),
                    'DEVELOPMENT' => t('Development'),
                    'ENHANCEMENT' => t('Enhancement'))
);
$form['type'] = array(
  '#title' => t('Project Type'),
  '#type' => 'select',
  '#description' => "Select the project count type.",
  '#options' => $form['type_options']['#value'],
);

In this case your HTML source code will look like this when your Drupal form is rendered:

<select id="edit-type" name="type" class="form-select">
  <option value="APPLICATION" selected="selected">Application</option>
  <option value="DEVELOPMENT">Development</option>
  <option value="ENHANCEMENT">Enhancement</option>
</select>

Note that you don't have to create this key/value array (a Map in Java) using the Drupal 'value' type that I've shown, but I thought I'd share that approach. This approach should also work, though I haven't tested it:

$values => array('APPLICATION' => t('Application'),
                 'DEVELOPMENT' => t('Development'),
                 'ENHANCEMENT' => t('Enhancement'))
);
$form['type'] = array(
  '#title' => t('Project Type'),
  '#type' => 'select',
  '#description' => "Select the project count type.",
  '#options' => $values,
);

(In fact, it's simpler, and I'll probably change my own project code to look like it.)

Drupal form SELECT/OPTION examples - Summary

I hope these Drupal form SELECT/OPTION field examples have been helpful. If you have any questions or comments, please leave a note below.

Post new comment

The content of this field is kept private and will not be shown publicly.