This tutorial solves the following questions:
- Add css property for individual components in Drupal form elements
- How can I add a class to a label with drupal's form API?
- Adding class to form-item
- How do I add classes to form elements?
- How to customize Drupal form element?
- How to add class/attributes to drupal form/form element/form label?
- How to alter drupal form/form element/form label?
Add Wrapper class to Drupal Form and Form attributes
<?php
/**
*implements hook_menu()
*
*/
function mymodule_menu(){
$items = array();
$items['mymodule'] = array(
'type' => MENU_NORMAL_ITEM,
'title' => 'My module Form',
'page callback' => 'drupal_get_form',
'page arguments' => array('mymodule_form'),
'access callback' => TRUE,
);
return $items;
}
function mymodule_form($form_state){
$form = array();
// Add a class to drupal form:
$form['#attributes'] = array('class'=>'drupal-custom-form');
$form['name'] = array(
'#type' => 'textfield',
'#description' => 'Enter your name',
);
$form['age'] = array(
'#type' => 'textfield',
'#description' => 'Enter your age',
);
// $form['name']['#attributes'] = array('disabled'=>'disabled');
// Add a class/attributes to drupal form elements:
// example - Add a class to drupal submit button
$form['submit'] = array(
'#type' => 'submit',
'#value' => 'Submit',
);
// for D6
$form['submit']['#attributes']['class'] = 'button large-button';
// For D7
//$form['submit']['#attributes']['class'] = array('button large-button');
return $form;
}
?> But we can not add an attributes to form label. Drupal does not provide any thing for this. But we can add wrapper to this form element and then apply CSS Later like this:
Add Wrapper class to Drupal Label
<?php
function mymodule_form($form_state){
$form = array();
// Add a class to drupal form:
$form['#attributes'] = array('class'=>'drupal-custom-form');
// since Drupal does not allow to add attributes to form Label, Add a wrapper class and apply css later
$form['name'] => array(
'#type' => 'textfield',
'#title' => 'Your name',
'#prefix' => '<div class="myClass">',
'#suffix' => '</div>'
);
return $form;
}
?> Adding Style to above wrapper class
<?php.myClass label { text-transform: uppercase; /* just for example */ } ?>
Alter some form attributes/form field to contributed module
In Drupal, we need to alter some fields of contributed modules frequently. Lets see how we do this ?
In order to do this, use hook_form_alter drupal api function
<?php
/**
*implements hook_form_alter()
*
*/
function mymodule_form_alter($form, $form_state, $form_id) {
if ($form_id == 'mymodule_form') {
// disable name field
// For D6
$form['name']['#attributes'] = array('disabled'=>'disabled');
// hide age field
// $form['age']['#access'] = FALSE;
// hide age field based on condition
// for anonymous user, hide age
global $user;
if (!$user->uid) {
$form['age']['#access'] = FALSE;
}
}
}
?> 