양식 요소의 div 래퍼에서 클래스 변경

api 양식을 사용하여 클래스를 양식 래퍼 (div)에 클래스를 추가하거나 변경하는 방법이 있습니까?

아니면 테마 기능으로 방금 완료 되었습니까?

그렇다면 어떤 테마 기능을 사용하여 변경합니까?

theme_form_element()테마를 전체적으로 변경하려는 경우 정상적으로 재정의 할 수 있습니다 . 하나의 특정 양식 요소 만 수정하려는 경우 몇 가지 선택 사항을 알고 있습니다.

1. 관심있는 특정 유형의 양식 요소 (예 : 텍스트 필드)에 대해 새 테마 기능을 등록 할 수 있습니다. 그런 다음 (예를 들어 원본을 기반으로 한)이 테마 함수를 만들지 theme_textfield()만 theme('form_element', ...)마지막 에는 호출하지 않습니다 (하나의 테마 함수에서 래퍼와 요소를 모두 처리하거나 별도의 래퍼 테마 함수를 만들 수 있습니다) 그리고 그것을 사용하십시오). 마지막으로 #theme특정 양식 요소에 속성을 추가하면 해당 요소에 사용자 정의 테마가 적용됩니다.

2. form_element.tpl.php기본 동작이 있는 템플릿 파일을 theme_form_element()만든 다음 hook_preprocess_form_element()템플릿 제안을 추가하는 데 사용할 수 있습니다. 그런 다음 제안과 일치하는 새 템플릿을 만듭니다. 사람들은 종종 템플릿이 함수보다 약간 느리다는 언급을 듣고 사람들이 자주 사용하는 테마 호출의 경우 사람들이 템플릿을 사용하는 데 걸리는 것을 상상할 수 있습니다. 그러나 나는 이것을 직접 측정하지 않았습니다. 또한 사전 프로세스 단계에서 제안을 할 수있는 충분한 컨텍스트가 있어야합니다.

나는 이것이 오래된 오래된 스레드라는 것을 알고 있지만 양식 요소를 변경하고 클래스를 추가하는 방법을 배우고 있습니다. 나는 커스텀 모듈을 만들었습니다.

function yourtheme_custom_form_alter(&$form, &$form_state, $form_id) {
 case'webform_number_whatever':
   _yourtheme_form_add_wrapper($form['submitted']['yourfieldhere'], array('form-field-some-style', 'not-label', 'whatever-other-styles-you-want'));
 break;
}

function _yourtheme_form_add_wrapper(&$element, $classes = array(), $type = array('form-item', 'form-type-textfield'), $removeTitle = FALSE){
  $element['#prefix'] = '<div class="' . implode(" ", $classes) . '"><div class="' . implode(" ", $type) . '">';
  $element['#suffix'] = '</div></div>';
}

"래퍼"를 변경하려면 form_element를 대체해야합니다. 기본적으로 모든 양식 요소는 form_element 테마 theme_form_element($element,$value);(form.inc 파일)로 렌더링됩니다.

따라서 이것이 폼 요소를 렌더링하는 방법을 변경하려면 해당 함수를 template.php 폴더에 복사하고 이름을 바꾸십시오. phptemplate_form_element($element,$value)

이제 변경을 할 수 있으며 원래 기능 대신 사용됩니다

1. theme_form_element($element,$value);form.inc에서 복사
2. (당신의 테마) template.php에 붙여 넣으십시오.
3. 이름을 다음과 같이 바꾸십시오. phptemplate_form_element($element,$value)
4. 모든 테마 캐시 지우기
5. 원하는대로 변경하면 사용됩니다.

wrapper_attributes 특성을 사용할 수 있습니다 .

$form['example'] = [
  '#type' => 'textfield',
  '#title' => $this->t('Example'),
  '#wrapper_attributes' => ['class' => ['wrapper-class']],
];

중요하게, theme_form_element는 직접 상위 랩퍼 div 만 수정하며 이는 CSS 효과의 대상이 아닐 수 있습니다.

[프로그래밍 방식은 아니지만 노드 필드의 최상위 래퍼 (래퍼, 래퍼, 래퍼)에 클래스를 적용하려는 경우 특정 컨텐츠 유형에 대해 "필드 관리"를 선택하여 "필드 그룹"모듈을 사용한다고 가정 할 수 있습니다. 간단한 DIV로 "새 그룹 추가"를 선택하십시오. 그런 다음 레이블을 제거하고 원하는 클래스를 추가 래퍼에 할당 할 수 있습니다 (그러나 이제는 더 많은 래퍼가 있습니다)-무제한 중첩

당신은 사용할 수 있습니다

'#prefix' => '<div class="new_class">', '#suffix' => '</div>'

그리고 이것은 그것을 감싸 줄 것입니다.

랩퍼 속성을 구성 가능하게하십시오!

테마에서 자신의 양식 요소 테마 기능을 작성하십시오 ... sites/all/themes/MY_THEME/theme/form-element.theme.inc

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

  $attributes = isset($element['#my_theme_wrapper_attributes']) ?
    $element['#my_theme_wrapper_attributes'] : array();

  ...

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

  ...
}

그럼 당신은 이런 것들을 할 수 있습니다 ...

function my_module_form_alter(&$form, &$form_state, $form_id) {
  $form['account']['mail']['#my_theme_wrapper_attributes']['class'][] = 'form-field--inline';
}

원하는 결과 를 얻 #prefix/#suffix거나 얻지 못하는 경우가 있습니다 #attributes => array('class'). 내 특별한 경우는 managed_file 요소 주위에 ajax-wrapper div에 클래스를 추가하는 것입니다. #prefix/#suffix새 컨테이너를 만들고 #attributes/'class'가장 바깥 쪽이 아닌 내부 요소의 클래스를 수정합니다.

가장 바깥 쪽 div는 그냥

<div id="edit-doc1--XX-ajax-wrapper">

CSS에서 타겟팅하기가 어렵습니다. 나는 타겟팅 할 수 있습니다 [id^="edit-doc"]또는 [id$="-ajax-wrapper"]더 내가 원하는 단지 요소보다이 목표지만 모두.

내가 생각해 낸 해결책 은 양식에 #process요소 를 추가하고 요소 코드를 수동으로 조작하는 것입니다. #process양식 항목의 선언에 추가 된 속성은 다음과 같습니다 .

$form['doc1'] = array(
  '#type' => 'managed_file',
  '#process' => array('mymodule_managed_file_process'),
);

그리고 mymodule_managed_file_process()기능은 다음과 같습니다.

function mymodule_managed_file_process($element, &$form_state, $form) {

  // Call the original function to perform its processing.
  $element = file_managed_file_process($element, $form_state, $form);

  // Add our own class for theming.
  $element['#prefix'] = str_replace(
    'id=',
    'class="managed-file-wrapper" id=',
    $element['#prefix']
  );

  return $element;
}

문자열 대체에 의존하는 것은 이식성이 높지 않으므로 str_replace위험 부담으로 사용 하십시오. 그러나이 코드는 실제로 가장 바깥 쪽 DIV를 변경하여 필요한 클래스를 추가합니다.

<div class="managed-file-wrapper" id="edit-doc1--XX-ajax-wrapper">

<?php
    $form['#attributes'] = array('class' => 'your-class-name');
?> 

위의 방법을 사용하여 양식 요소에 클래스를 추가 할 수 있습니다.