양식 레이블에 CSS 클래스를 추가하려면 어떻게합니까?

Drupal 8 Form API를 사용하는 페이지의 레이블에 CSS 클래스를 추가하고 싶습니다. 나는 그것을 적용하는 방법에 대한 온라인 참조를 찾을 수 없었습니다. 다음 해결 방법을 사용했지만 이상한 결과가 발생합니다.

public function buildForm(array $form, FormStateInterface $form_state)
{
    $form['label1']  = array(
        '#type' => 'label',
        '#title' => $this->t('QUESTIONNAIRE'),
        '#id'         => 'lbl1',
        '#prefix'     => '<div class="caption1">',
        '#suffix'     => '</div>',
    ) ;

렌더링 된 HTML은 다음과 같습니다.

<div class="caption1"><label for="lbl1" class="control-label">
<div class="caption1"></div>QUESTIONNAIRE
  </label>

div 문은 잘못된 위치에있을뿐만 아니라 두 번 렌더링됩니다.

나는 몇 년 전에 이것이 불가능하다는 것을 보여주는 게시물을 발견했지만 그 이후로 D8과 함께 수정되기를 바라고 있습니다. 접두사 / 접미사로하고 싶지 않지만 별도의 배열 요소로 사용하고 싶습니다.

추신 :이 사이트는 Drupal 8.0.0-rc2입니다

나는 이것이 오래된 스레드라는 것을 알고 있지만 누구나 인터넷 검색을합니다.

이에 대한 단서는에 template_preprocess_form_element()있습니다.

$element += [
    '#title_display' => 'before',
    '#wrapper_attributes' => [],
    '#label_attributes' => [],
  ];

#label_attributes 표준 속성 배열이므로 클래스를 설정하기가 매우 쉽습니다. ['class' => ['my-class', 'other-class']]

#title_display 3 개의 값을받습니다 :

• before : 라벨이 요소보다 먼저 출력됩니다. 이것이 기본값입니다.

• 이후 : 레이블이 요소 다음에 출력됩니다. 예를 들어 라디오 및 확인란 #type 요소에 사용됩니다.

• 보이지 않음 : 레이블은 스크린 리더가 양식을 제대로 탐색 할 수 있지만 시각적으로 혼란 스러울 수 있도록하는 데 중요합니다. 이 속성은 스크린 리더를 제외한 모든 사람의 레이블을 숨 깁니다.
• attribute : 툴팁을 작성하지만 레이블 요소를 출력하지 않도록 요소에 title 속성을 설정하십시오. 이것은 체크 박스와 라디오에서만 지원됩니다

방금 이것을 확인했으며 레이블 요소에 클래스를 직접 추가 할 수 있다고 생각하지 않습니다.

아시다시피 클래스는 일반적으로 다음과 같이 #attributes로 추가됩니다.

 $form['foo'] = array(
  '#type' => 'textfield',
  '#title' => 'Foo',
  '#attributes' => array('class' => array('first-class', 'second-class')),
);

그러나 방금 테스트했으며 #attributes는 Label 요소에 클래스를 추가하지 않습니다.

랩퍼 양식 요소를 추가하고 클래스를 제공 한 후 랩퍼 요소의 하위 요소라는 사실을 기반으로 레이블의 스타일을 지정할 수 있습니까? 이처럼 :

$form['container'] = array(
  '#type' => 'container',
  '#attributes' => array('class' => array('your-class')),
);
$form['container']['foo'] = array(
  '#type' => 'textfield',
  '#title' => 'Foo',
);

이제 클래스가있는 DIV 요소 내부에 예제 텍스트 필드 (및 해당 레이블)를 렌더링합니다. 즉, 레이블을 지정할 수 있습니다.

.your-class label {
  /* your CSS here */
}

Drupal> = 8.0.0에는 몇 가지 옵션이 있습니다. 이것들은 모두 테마의 템플릿 재정의와 관련이 있지만 모듈은 다른 모듈에 의해 정의 된 템플릿 전처리 후크 를 구현할 수 있어야 합니다

1. 가장 단순하지만 비 동적 옵션은 form-element-label.html.twig를 직접 재정의하는 것 입니다. 모든 레이블이 form-control클래스 를 가져 오면 작동 할 수 있습니다 .
2. 이러한 행을 따라 template_preprocess_form_element_label 을 구현 form-control하면 템플릿을 재정의하지 않고도 동일한 작업을 수행하고 속성 에 클래스를 추가 할 수 있습니다 .
3. template_preprocess_form_element 를 구현 하고 덮어 쓰지 않도록 논리를 추가 할 수 $variables['label']있지만 양식 요소 배열의 정의 된 일부 키에서 값을 가져옵니다.

제출 버튼의 경우 아래와 같이 클래스를 추가 할 수 있습니다.

$ form [ 'actions'] [ 'submit'] [ '# attributes'] [ 'class'] [] = 'use-ajax-submit';

내가 찾은 가장 깨끗한 옵션은 위의 @ mradcliffe의 # 3 제안에 따른 것입니다. 예를 들어 양식 정의에서-

$form['distance'] = [
        '#type' => 'select',
        '#title' => 'Distance',
        '#required' => true,
        '#options' => [
            '10' => '10 Miles',
            '25' => '25 Miles',
            '50' => '50 Miles',
            '100' => '100 Miles'
        ],
        '#label_classes' => [
            'some-label-class'
        ]
    ];

그런 다음 사용자 정의 모듈에서 hook_preprocess_form_element를 구현하십시오.

/**
* Implementation of hook_preprocess_form_element
* @param $variables
*/
function your_module_preprocess_form_element(&$variables)
{
    if(isset($variables['element']['#label_classes'])) {
        $variables['label']['#attributes']['class'] = $variables['element']['#label_classes'];
    }
}

이것은 Drupal이 추가하고자하는 모든 레이블 클래스를 무시합니다. 제 경우에는 괜찮습니다. 필요한 경우이를 방지하기 위해 위의 코드를 변경할 수 있습니다.

@Nate 답변을 완료하려면 이러한 클래스를 기존 양식에 추가하려면 hook_form_alter에서 수행하십시오.

function your_module_form_alter(&$form, FormStateInterface &$form_state, $form_id)
{
    // for a textfield
    $form['distance']['widget'][0]['value']['#label_classes'] = ['some-label-class'];
    // for a radio field
    $form['country']['widget']['#label_classes'] = ['some-label-class'];
}

그런 다음 텍스트 필드에는 hook_preprocess_form_element를, 라디오 필드에는 hook_preprocess_fieldset을 사용하십시오.

/**
 * Implements hook_preprocess_hook().
 */
function your_module_preprocess_fieldset(&$variables)
{
  if(isset($variables['element']['#label_classes'])) {
    foreach ($variables['element']['#label_classes'] as $class) {
      $variables['legend']['attributes']->addClass($class);
    }
  }
}