Уникальные классы для значений множественных полей

Главные вкладки

Аватар пользователя Наденька Наденька 16 июля 2015 в 14:55

Привет друзья, возникла забавная задачка над которой уже всю голову сломала. Есть тип материала "объекты" есть дополнительное поле (с множественными значениями) "опции", через тип поля "Список (текст)".

В этом поле забиты ключи и значения типа:

opt01|Есть кондиционер
opt02|Есть кровать
opt03|Есть душевая

Задача:

Нужно при выводе поля в ноде добавить классы к каждому из значений на основе ключа.

Сейчас это выглядит так:

<div class="field field-name-field-options field-type-list-text field-label-above">
<div class="field-label">Опции:</div>
<div class="field-items">
<div class="field-item even">Есть кондиционер</div>
<div class="field-item odd">Есть кровать</div>
<div class="field-item even">Есть душевая</div>
</div></div>

А нужно так:

<div class="field field-name-field-options field-type-list-text field-label-above">
<div class="field-label">Опции:</div>
<div class="field-items">
<div class="field-item even opt01">Есть кондиционер</div>
<div class="field-item odd opt02">Есть кровать</div>
<div class="field-item even opt03">Есть душевая</div>
</div></div>

Собственно зачем это всё? Да очень просто, нужно приклеить иконки которые будут выводиться в зависимости от выбранных на странице чекбоксов.

Всю голову поломала, не нашла решения, максимум что мне удалось нарыть, это задать классы типа opt01, opt02...

<?php 
     
if ($vars['element']['#field_name'] == 'FIELD_NAME') {
      
$classes .= ' row-' $i;
      
$i++;
    }
?>

Каждому из значений поля задавался порядковый класс, но это не подходит так как не являеться уникальным классом на основе содержимого. Помогите пожалуйста, в какую сторону мне копать?

Идея

По мимо того, что это можно как то решить на уровне API или хуков, до чего моя голова не доходит, возникла идея сделать следующий трюк:

В отображениях полей в качестве значении поля можно отобразить ключи:

<div class="field field-name-field-options field-type-list-text field-label-above">
<div class="field-label">Опции:</div>
<div class="field-items">
<div class="field-item even">opt01</div>
<div class="field-item odd">opt02</div>
<div class="field-item even">opt03</div>
</div></div>

И затем в теории их можно на jquery захреначить в классы.

Сразу скажу, я не сильна в jquery и честно пыталась сама это решить таким образом:

$('.field-name-field-options .field-item').addClass($(".field-name-field-options .field-item").text())

Ну и конечно же получила такую красоту:

<div class="field field-name-field-options field-type-list-text field-label-above">
<div class="field-label">Опции:</div>
<div class="field-items">
<div class="field-item even opt01opt02opt03">opt01</div>
<div class="field-item odd opt01opt02opt03">opt02</div>
<div class="field-item even opt01opt02opt03">opt03</div>
</div></div>

Буду очень благодарна за любую помощь в данной задаче, может вы знаете совершенно инные пути, я лишь попыталась изложить те вещи, до которых догадалась.

Комментарии