I am having a problem regarding the validation of the hidden fields.

I have some some fields that are hidden and only visible if a specific field is selected.

And I marked those those hidden fields as required. So I want to validate those fields only if they are visible and not validate if they are hidden.

I tried the client side validation module but the problem is if I enter the visible required field values then upon submission it also validate those hidden fields.

Any idea?

  • Only way is to make custom form validate for that form and avoiding the required value.
    – niksmac
    Aug 16, 2012 at 8:07
  • can you give an example of it please?
    – Ahmad
    Aug 16, 2012 at 8:44

2 Answers 2


You need to use #ajax attribute on your specific field to alter the form ( to remove #required for your hidden element ). It lets Drupal re-build the form before submission and core validation. You will need to implement hook_form_alter and an ajax callback function.

Here is a workaround.

function yourmodule_form_alter(&$form, &$form_state, $form_id) {
    if($form_id == 'user_register_form'){

        $form['toggle_me'] = array(
            '#type' => 'checkbox',
            '#title' => t('Tick this box to type'),
            '#ajax' => array(
              // #ajax has two required keys: callback and wrapper.
              // 'callback' is a function that will be called when this element changes.
              'callback' => 'ajax_form_alter',
              // 'wrapper' is the HTML id of the page element that will be replaced.
              'wrapper' => 'replace_field_div',
              // Don't show any throbber...
              'progress' => array('type' => 'none'),              

        # This field will be shown or hidden when "toggle_me" is checked or unchecked
        $form['dependency'] = array(
          '#type'       => 'hidden', # initially hidden
          '#title'      => 'Dependency',
          '#required'   => TRUE,
          '#prefix'     => '<div id="replace_field_div">',
          '#suffix'     => '</div>',          
        // An AJAX request calls the form builder function for every change.
        // We can change how we build the form based on $form_state.        
        if(isset($form_state['values']['toggle_me']) && $form_state['values']['toggle_me'] == 1){
            # when "toggle_me" is checked, show this field and set required.
            $form['dependency']['#type'] = 'textfield'; 
            $form['dependency']['#required'] = TRUE;    
            # when "toggle_me" is unchecked, hide this field and remove required.
            $form['dependency']['#type'] = 'hidden';    
            $form['dependency']['#required'] = FALSE;           
 * Callback for toggle_me
 * On an ajax submit, the form builder function is called again, then the $form
 * and $form_state are passed to this callback function so it can select which
 * portion of the form to send on to the client.
 * @return renderable array (the textfield element)
function ajax_form_alter($form, $form_state){
    return $form['dependency']; 

The example shows only two new elements ( toggle_me and dependency ) which are added to user registration form using hook_form_alter. When "toggle_me" is checked, show "dependency" and set required. When "toggle_me" is unchecked, hide "dependency" and remove required.
If you don't know about ajax form alter, download examples module and check ajax example.


Specify the conditions under which the field is required using drupal_process_states(). There's a UI for it, called Conditional Fields, but it does not have a recommended release yet.

Your Answer

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

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