Hi,

The error happened when I create a boolean field with checkbox/radio button, the value of the field is not selectable. Only one value is selectable. Here is the screenshot of the error/invisible checkbox field on order edit page:

Radio Error

Defective HTML Code:

<div class="form-item form-type-radios form-item-field-flag-include-ppn-und">
   <div class="field-label"> <label for="edit-field-flag-include-ppn-und">Include PPN <span class="form-required" title="This field is required.">*</span></label>
   </div>
   <div id="edit-field-flag-include-ppn-und" class="form-radios">
      <div class="form-item form-type-radio form-item-field-flag-include-ppn-und tooltip-onfocus">
         <div class="field-wrap-0"><input id="edit-field-flag-include-ppn-und-0" name="field_flag_include_ppn[und]" value="0" checked="checked" class="form-radio" type="radio"></div>
      </div>
      <div class="form-item form-type-radio form-item-field-flag-include-ppn-und">
         <input id="edit-field-flag-include-ppn-und-1" name="field_flag_include_ppn[und]" value="1" class="form-radio" type="radio"> 
         <div class="field-label"> <label class="option" for="edit-field-flag-include-ppn-und-1">Termasuk PPN </label>
         </div>
      </div>
   </div>
</div>

And here after I do some HTML modification from Firefox Inspector, this is the expected result:

Radio OK

The HTML Code become:

<div class="form-item form-type-radios form-item-field-flag-include-ppn-und">
    <div class="field-label"> 
        <label for="edit-field-flag-include-ppn-und">Include PPN <span class="form-required" title="This field is required.">*</span></label>
    </div> 
    <div id="edit-field-flag-include-ppn-und" class="form-radios">
        <div class="form-item form-type-radio form-item-field-flag-include-ppn-und">
            <input id="edit-field-flag-include-ppn-und-0" name="field_flag_include_ppn[und]" value="0" checked="checked" class="form-radio" type="radio">
            <div class="field-label"> 
                <label class="option" for="edit-field-flag-include-ppn-und-0">Belum Termasuk PPN </label>
            </div>
        </div>
        <div class="form-item form-type-radio form-item-field-flag-include-ppn-und">
            <input id="edit-field-flag-include-ppn-und-1" name="field_flag_include_ppn[und]" value="1" class="form-radio" type="radio"> 
            <div class="field-label"> 
                <label class="option" for="edit-field-flag-include-ppn-und-1">Termasuk PPN </label>
            </div>
        </div>
    </div>
</div>

So, how can I apply a fix for this theme issue?

CommentFileSizeAuthor
#2 Radio OK.PNG2.52 KBHarsikesa
#2 Radio Error.PNG1.4 KBHarsikesa
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Harsikesa created an issue. See original summary.

Harsikesa’s picture

Issue summary: View changes
FileSize
1.4 KB
2.52 KB
Harsikesa’s picture

I found temporary solution, just change file \profiles\erpal_platform\themes\erpal_theme\theme\form-element.theme.inc

from:

$attributes['class'][] = 'tooltip-onfocus'; 
$children = '<div class="field-wrap-' . $field_type . '">' . $children . '</div>'; 

to:

//$attributes['class'][] = 'tooltip-onfocus'; 
//$children = '<div class="field-wrap-' . $field_type . '">' . $children . '</div>'; 

and add:

case 'focus': 
        $output .= sprintf( 
        ' %s <div class="field-label">%s %s</div>' . "\n", 
        $children, 
        str_replace('<label','<label class="option"',theme('form_element_label', $variables)), 
        $desc 
      ); 
      break; 

so the final file would become:

<?php
/*
 * @file form-element.theme.inc.
 */

function erpal_theme_form_element(array $variables) {
  $element = &$variables['element'];

  // This function is invoked as theme wrapper, but the rendered form element
  // may not necessarily have been processed by form_builder().
  $element += array(
    '#title_display' => 'before',
  );

  // Add element #id for #type 'item'.
  if (isset($element['#markup']) && !empty($element['#id'])) {
    $attributes['id'] = $element['#id'];
  }
  // Add element's #type and #name as class to aid with JS/CSS selectors.
  $attributes['class'] = array('form-item');
  if (!empty($element['#type'])) {
    $attributes['class'][] = 'form-type-' . strtr($element['#type'], '_', '-');
  }
  if (!empty($element['#name'])) {
    $attributes['class'][] = 'form-item-' . strtr($element['#name'], array(
          ' ' => '-',
          '_' => '-',
          '[' => '-',
          ']' => ''
        ));
  }
  // Add a class for disabled elements to facilitate cross-browser styling.
  if (!empty($element['#attributes']['disabled'])) {
    $attributes['class'][] = 'form-disabled';
  }
  // add description class for tooltip positioning
  if (!empty($element['#description'])) {
    $attributes['class'][] = 'has-tooltip';

    if ($element['#title_display'] == 'none' || $element['#title_display'] == 'invisible') {
      $attributes['class'][] = 'has-no-title';
    }
  }

  // changing description markup for bootstrap tooltip support
  $desc = '';
  if (!empty($element['#description'])) {
    $desc = sprintf(
      '<div class="description" data-toggle="tooltip" title="%s"></div>',
      htmlspecialchars($element['#description'])
    );
  }

  // If #title is not set, we don't display any label or required marker.
  if (!isset($element['#title'])) {
    $element['#title_display'] = 'none';
  }
  $prefix = isset($element['#field_prefix']) ? '<span class="field-prefix">' . $element['#field_prefix'] . '</span> ' : '';
  $suffix = isset($element['#field_suffix']) ? ' <span class="field-suffix">' . $element['#field_suffix'] . '</span>' : '';

  $children = $prefix . $element['#children'] . $suffix;

  // @TODO manipulate field by type > should be done by a widget
  if (!empty($element['#array_parents']) && count($element['#array_parents'])) {
    $field_type = array_pop($element['#array_parents']);
    switch ($field_type) {
      case 'date':
      case 'time':
        // special state
        $element['#title_display'] = 'focus';
        //$attributes['class'][] = 'tooltip-onfocus';
        //$children = '<div class="field-wrap-' . $field_type . '">' . $children . '</div>';
        break;
    }
  }

  // output handling
  $output = '<div' . drupal_attributes($attributes) . '>' . "\n";

  switch ($element['#title_display']) {
    case 'before':
    case 'invisible':
      $output .= sprintf(
        ' <div class="field-label">%s %s</div> %s' . "\n",
        theme('form_element_label', $variables),
        $desc,
        $children
      );
      break;

    case 'after':
      $output .= sprintf(
        ' %s <div class="field-label">%s %s</div>' . "\n",
        $children,
        theme('form_element_label', $variables),
        $desc
      );
      break;

    case 'focus':
        $output .= sprintf(
        ' %s <div class="field-label">%s %s</div>' . "\n",
        $children,
        str_replace('<label','<label class="option"',theme('form_element_label', $variables)),
        $desc
      );
      break;
    case 'none':
    case 'attribute':
      // Output no label and no required marker, only the children.
      $output .= ' ' . $children . "\n" . $desc;
      break;
  }

  $output .= "</div>\n";

  return $output;
}

hope this help urgent people