Использование JQuery и JSF

303

28 августа 2017, 06:39

Есть таблица в xhtml файле на JFS. Требуется, при помощи JQuery проверить значения в ячейках конкретного столбца и при совпадении с образцом изменить цвет фона. В js и в JQuery - полный ноль. Никогда фронтэндом не занимался. Знаю только как подключить библиотеку. Как это можно сделать? Важно, событие должно происходить при загрузке страницы.

Answer 1

Попробуйте такой пример, таблица с одним столбцом, при загрузке страницы отработает JQuery и изменит фон ячейки.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://xmlns.jcp.org/jsf/html"
  xmlns:f="http://java.sun.com/jsf/core">
<h:head>
    <title>Facelet Title</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
</h:head>
<h:body>
    <h:dataTable value="#{order.orderList}" var="o">
        <h:column>
            <f:facet name="header">Order No</f:facet>
            <h:outputText styleClass="order" value="#{o}" />
        </h:column>
    </h:dataTable>
    <script type="text/javascript">
    //<![CDATA[
        $(document).ready(function () {
            $('.order').each(function (index) {
                // какое-то условие
                if ($(this).text().trim() > 5) {
                    $(this).parent().css({'background-color': 'red'});
                }
            });
        });
    //]]>
    </script>
</h:body>