I am desperately trying to a way that I can rewrite the ID of an exposed filter field element. I've gotten so far as to set up hook_form_alter where I can get the specific $form array that I need. When I look at that array using dpm($form) I can see where other info for that input element is contained, but there is no ID element in the array that I can see.

This is the current output that I'm concerned about from my exposed filters form:

<div id="edit-field-location-type-tid-label">Location Type</div>
  <div class="views-widget">
    <div class="form-item form-type-select form-item-field-location-type-tid">
      <div class="form-checkboxes bef-select-as-checkboxes">
        <div class="bef-checkboxes">
          <div class="form-item form-type-bef-checkbox form-item-edit-field-location-type-tid-370">
            <input type="checkbox" name="field_location_type_tid[]" id="edit-field-location-type-tid-370" value="370"  /> <label class='option' for='edit-field-location-type-tid-370'>Parks</label>
          <div class="form-item form-type-bef-checkbox form-item-edit-field-location-type-tid-371">
            <input type="checkbox" name="field_location_type_tid[]" id="edit-field-location-type-tid-371" value="371"  /> <label class='option' for='edit-field-location-type-tid-371'>Historic Sites</label>
          <div class="form-item form-type-bef-checkbox form-item-edit-field-location-type-tid-372">
            <input type="checkbox" name="field_location_type_tid[]" id="edit-field-location-type-tid-372" value="372"  /> <label class='option' for='edit-field-location-type-tid-372'>Marine Conservation Areas</label>
          <div class="form-item form-type-bef-checkbox form-item-edit-field-location-type-tid-735">
            <input type="checkbox" name="field_location_type_tid[]" id="edit-field-location-type-tid-735" value="735"  /> <label class='option' for='edit-field-location-type-tid-735'>Urban Parks</label>
          <div class="form-item form-type-bef-checkbox form-item-edit-field-location-type-tid-736">
            <input type="checkbox" name="field_location_type_tid[]" id="edit-field-location-type-tid-736" value="736"  /> <label class='option' for='edit-field-location-type-tid-736'>Other</label>

Specifically, the markup I want to change is the following:

<input type="checkbox" name="field_location_type_tid[]" id="edit-field-location-type-tid-370" value="370"  />  <label class='option' for='edit-field-location-type-tid-370'>Parks</label>

I want to be able to rewrite the id of the input element and the for of the label element.

This I've got the following in my template.php file:

function parks_form_views_exposed_form_alter(&$form, &$form_state, $form_id) {
  if($form['#id'] == 'views-exposed-form-photo-gallery') {

Looking at what dpm returns for the $form array I can see where in that array the info for these check boxes exist, but there is nothing in there that makes any sense in terms of rewriting the ID. What I'm seeing is the following:


I was hoping there would have been an obvious ID element in that array, likely as a child to the child elements of the #options element but no such luck.

I've been looking for a solution for this for a couple of days now and I'm just spinning my wheels. Everything I can find is people customizing the wrapper classes and stuff, but no one getting this granular. Any help is greatly appreciated.

2 Answers 2



I'm leaving the code below but just for kicks I went into my dev theme and did a hook_form_alter() to test another way of achieving what you want to do. What you are when you do the dpm() isn't the full output of what can possibly be changed in the HTML. You can do the following to change the ID.

function THEMENAME_form_alter(&$form, &$form_state, $form_id) {
  dpm($form); // Print out before change.
  // The 'created' was my form element, yours would be which checkbox you wanted to change.
  $form['created']['#id'] = drupal_html_id('my-new-id');
  dpm($form); // Print out after change.

The images below show the changes in the ID and the dpm() output. They are for a select box but it should work the same for any form element.

Before Change: Before change

After Change: After Change

The HTML Change: HTML after change

Original Thought:

I think you have to use hook_theme_form_element() for this.

function <theme_name>_form_element($variables) {
  $element = $variables['element'];
  // Do something with checkbox
  if ($element['#type'] == 'checkbox' {
    // do something with element array like $variables['element']['#id'] = 'new value'
  return theme_form_element($variables);

The code above isn't tied to a certain form ID so you may have to do a little more processing to get to that piece but it should be a good starting point. Don't forget to make the ID's unique as they are originally.

Checkout the API docs for more information.

Or you can try preprocessing the form element as well, I have done this with other elements but not sure if I changed the ID's.

function MYTHEME_preprocess_form_element(&$vars) {
  $vars['attributes']['id'][] = 'another-id ';

Why to change this?

See #id in the form api

Description: Internal. Used to populate form elements' id property. In rare cases, you can set this value yourself on a form element, to override the default setting.

This site is temporarily in read-only mode and not accepting new answers.

Not the answer you're looking for? Browse other questions tagged .