Как установить цвет для строки selectonemenu

Question 1

Как я могу установить цвет в строку p: selectOneMenu, у меня есть selectOneMenu со списком клиентов. Отмененные клиенты хотят, чтобы строка была красного цвета.

     <p:selectOneMenu id="listaClientesmodi" value="#{clientesMB.selectedEmpClienteCancelarContrato}" converter="clientesConverter"  panelStyle="width:500px"  
                                 effect="fade" var="p" style="width:500px"  filter="true" filterMatchMode="contains">  

                    <f:selectItems value="#{comunMB.itemsClientes}"/>  

                    <p:column>  
                        #{p.codigo} - #{p.nombre}  
                    </p:column>  
                    <f:ajax execute="@this"  listener="#{clientesMB.cargarContratosClienteSelected}"  render=":form2:panelDetalles :form2:panelEditContrato" />
                </p:selectOneMenu>

primefaces

0

meyquel 19 Апр 2013 в 19:34

Answer

Если вы хотите, чтобы все строки были закрашены:

.ui-selectonemenu-item {
    background-color: aqua!important;
}

Но если вы хотите сделать условную покраску; Я нашел немного сложное решение, конечно, могут быть другие и более простые решения.

Чтобы применить мое решение, вам нужно поле, которое соответствует размеру ваших клиентов, показанных в p:selectOneMenu. Но что еще важнее, вам нужно добавить текст вроде canceled или что-то еще, что скажет функции js, что элемент нужно нарисовать.

Если comunMB.itemsClientes отображается в p:selectOneMenu, объедините "отмененную" строку с отмененными клиентами. Потому что отмененных клиентов нужно отличать от других. И мое решение требует извинения, потому что это было лучшее, что я могу сделать.

$(document).ready(function() {
    for (var i = 0; i &lt; '#{clientesMB.size}'; i++) {
        if($(".ui-selectonemenu-items li:nth-child("+i+")").text().indexOf("Canceled") != -1) {
            $(".ui-selectonemenu-items li:nth-child("+i+")").css({"background-color":"#ff1315"});
        }
    }
});

Так; p:selectOneMenu создает список в формате html. Если вы исследуете это в настройках разработчика браузеров, это выглядит так:

<ul class="ui-selectonemenu-items">
    <li>First Item</li>
    <li>Second Item</li>
    <li>Third Item</li>
</ul>

Итак, функция сначала выбирает элемент из своего класса CSS, который называется ui-selectonemenu-items, и ищет его дочерних элементов, и для каждого дочернего элемента, который она ищет, они отменены или нет.

Функция indexOf возвращает -1, если элемент не включает строку «отменен», поэтому мы находим элементы, у которых есть «отмененный» текст, и меняем цвет их фона, вот и все.

2

Ömer Faruk Almalı 19 Апр 2013 в 23:36

1

Или, если вы знаете точное количество ваших клиентов, укажите это число '#{clientesMB.size}'

–

Ömer Faruk Almalı

19 Апр 2013 в 23:58

Question 2