2

Due to a design request, I need to add a DIV around each textfield/select field in my webform.

Since a webform is, both, a form and a node, I'm struggling to figure out how to do that.

In a normal form, I would use the hook_form_alter() and use the #prefix and #suffix attributes to add extra markup, but when printing out the webform in the hook to see the structure of the fields I can't see how to target each field.

Any help will be greatly appreciated!

Thanks.

6

You're correct in thinking to use the #prefix and #suffix attributes. Webform components are stored in the 'submitted' part of the form array. To add a surrounding div to each textfield and select, you can do the following in hook_form_alter:

if ($form_id == 'webform_client_my_form_id') {
  foreach($form['submitted'] as &$field) {
    if($field['#type'] == 'textfield' || $field['#type'] == 'select') {
        $field['#prefix'] = '<div class="my-div">';
        $field['#suffix'] = '</div>';
    }
  }
}

To find out your form id, you can add a watchdog statement:

watchdog('My Module', "Form Id: $form_id");

Then check the dblog at /admin/reports/dblog.

This link may also be helpful: https://drupal.org/node/1558246

0

Alternative to Form Hook, you can use the webform-form-{form-id}.tpl.php template file to accommodate your changes.

For Example,

$form['submitted']['name']['#prefix'] = '<div class="form-group">';
$form['submitted']['name']['#suffix'] = '</div>';
$form['submitted']['name']['#attributes']['class'][] = 'form-control snow_form_control';

Like above you can add the required class or wrappers. Hope this helps.

New contributor
Harish ST is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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