ADF не переходит в CSS: состояние проверено

Я новичок в ADF, и сейчас у меня проблема с настройкой флажков и переключателей ADF с помощью CSS. Вот демо:

`http://jsfiddle.net/sbef2so3/16/`

В jsfiddle все работает нормально, но в ADF состояние не меняется на :checked. Может быть, есть другой способ изменить состояние флажка/переключателя в ADF?

!ВАЖНО. Я не могу изменить HTML-код, так как он создается ADF.


person Raimonds Sokoļvjaks    schedule 03.11.2014    source источник
comment
Я думаю, что это меняется на :checked . . . Это возможно?   -  person Drazzah    schedule 03.11.2014
comment
Господи, когда я использую этот код в JDeveloper 11.1.1.7.0, он не работает. Когда я нажимаю радиокнопку, ничего не происходит, все остается по-прежнему.   -  person Raimonds Sokoļvjaks    schedule 03.11.2014


Ответы (1)


Какой компонент вы используете для флажка или переключателя. Я использовал простые теги HTML на своей странице jsf, добавил ваш код CSS и увидел тот же результат, что и ваша скрипка:

<input type="radio" name="..." value="..." />

Если вы используете компонент ADF, например selectBooleanRadio, ожидается, что он создаст Файл скина ADF, который является расширенным набором CSS, и здесь мы пишем селекторы, нацеленные на компоненты, а не на сами элементы DOM. Итак, это пример файла скина:

af|selectBooleanRadio::label {
    color: green;
}

Это закрасит метки selectBooleanRadio компонентов зеленым цветом.

Изменение таблицы стилей CSS на скин ADF — нетривиальная задача, если не невозможная из-за внутренних ограничений ADF. Таким образом, придерживаясь простого решения CSS, возможно, вы сможете заставить свои стили работать, добавив styleClass к компоненту, который может подавлять нежелательные добавленные стили текущей темой приложения:

<af:selectBooleanRadio text="ADF Radio Button" label="Label" styleClass="customRadioButtonComp"/>

В файле .css добавьте префикс класса:

.customRadioButtonComp input[type="radio"] {
    display: inline-block;
    width: 21px;
    height: 21px;
    margin: -1px 4px 0 0;
    vertical-align: middle;
    background: url(http://csscheckbox.com/checkboxes/u/csscheckbox_ef32e9f2ed5c57aba4c2206a981ba7a4.png)0px top no-repeat;
    cursor: pointer;
    appearance: none;
    -moz-appearance: none;
    /* Firefox */

    -webkit-appearance: none;
    /* Safari and Chrome */
}

.customRadioButtonComp input[type="radio"]:checked {
    background: url(http://csscheckbox.com/checkboxes/u/csscheckbox_ef32e9f2ed5c57aba4c2206a981ba7a4.png)0px bottom no-repeat;
}
person reith    schedule 04.11.2014