<!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://xmlns.jcp.org/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Первая программа на JSF</title>
<h:outputStylesheet library="css" name="style.css"/>
</h:head>
<h:body>
<div class="container">
<h:form id="mainForm">
<h1>Моя первая программа на JSF</h1>
<!-- Блок с приветствием -->
<div class="greeting">
<h:panelGroup rendered="#{not empty counterBean.name}">
<p style="color: green;">#{counterBean.message}</p>
</h:panelGroup>
<h:inputText value="#{counterBean.name}"
placeholder="Введите ваше имя"
required="true"
requiredMessage="Поле имя обязательно для заполнения">
<f:ajax event="blur" listener="#{counterBean.validateName}" />
</h:inputText>
<h:message for="mainForm:name" style="color: red;" />
</div>
<!-- Блок со счетчиком -->
<div class="counter">
<h2>Счетчик: #{counterBean.count}</h2>
<div class="buttons">
<h:commandButton value="-" action="#{counterBean.decrement}" />
<h:commandButton value="Сброс" action="#{counterBean.reset}" />
<h:commandButton value="+" action="#{counterBean.increment}" />
</div>
</div>
<!-- Сообщения о событиях -->
<h:messages globalOnly="false" layout="list" />
</h:form>
</div>
</h:body>
</html>
<!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://xmlns.jcp.org/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Первая программа на JSF</title>
<h:outputStylesheet library="css" name="style.css"/>
</h:head>
<h:body>
<div class="container">
<h:form id="mainForm">
<h1>Моя первая программа на JSF</h1>
<!-- Блок с приветствием -->
<div class="greeting">
<h:panelGroup rendered="#{not empty counterBean.name}">
<p style="color: green;">#{counterBean.message}</p>
</h:panelGroup>
<h:inputText value="#{counterBean.name}"
placeholder="Введите ваше имя"
required="true"
requiredMessage="Поле имя обязательно для заполнения">
<f:ajax event="blur" listener="#{counterBean.validateName}" />
</h:inputText>
<h:message for="mainForm:name" style="color: red;" />
</div>
<!-- Блок со счетчиком -->
<div class="counter">
<h2>Счетчик: #{counterBean.count}</h2>
<div class="buttons">
<h:commandButton value="-" action="#{counterBean.decrement}" />
<h:commandButton value="Сброс" action="#{counterBean.reset}" />
<h:commandButton value="+" action="#{counterBean.increment}" />
</div>
</div>
<!-- Сообщения о событиях -->
<h:messages globalOnly="false" layout="list" />
</h:form>
</div>
</h:body>
</html>