Boa noite pessoas !
É o seguinte: Ao tentar gravas os dados faço uma validação para verificar se o usuário deixou algum campo sem informação. Essa validação é feita via javascript:
Após a validação é exibida a mensagem e a tela continua aberta, atá ai tudo bem, porém o campos validado não fica com a borda em vermelho e quando eu saiu da tela e volto ai sim o campo é marcado com a borda em vermelho sinalizando a obrigatoriedade…
o que deveria ocorrer era quando exibida a mensagem os campos obrigatórios já ficassem sinalizados em vermelho e ao sair da tela com o botão cancelar e depois voltasse não tivesse mais sinalizado, como se ocorreu uma validação. segue código fonte:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
template="/template/paginaModelo.xhtml">
<ui:define name="conteudo">
<ui:include src="/template/cadastroInclude.xhtml" />
</ui:define>
<ui:define name="manutencao">
<h:form id="frmFornecedorTabela">
<!-- Panel tabela de fornecedores -->
<p:panel
id="pnlFornecedorTabela"
header="Tabela Fornecedores"
styleClass="panel-form"
style="width:540px">
<!-- Grade tabela de fornecedores -->
<p:dataTable
id="tabFornecedorTabela"
widgetVar="filtroFornecedorTabela"
value="#{fornecedorBean.listaFornecedor}"
var="item"
filteredValue="#{fornecedorBean.listaFiltroFornecedor}"
emptyMessage="Nenhum fornecedor cadastrado."
paginator="true"
paginatorPosition="bottom"
rows="10"
rowsPerPageTemplate="5,10,15,20"
reflow="true"
styleClass="data-table">
<!--
<f:facet name="header">
<p:commandButton
value="Incluir"
icon="ui-icon-new"/>
</f:facet>
-->
<p:column width="58px;" headerText="Código" sortBy="#{item.codFornecedor}">
<h:outputText value="#{item.codFornecedor}" />
</p:column>
<!-- filterBy="#{fornecedor.desFornecedor}" -->
<p:column headerText="Nome" sortBy="#{item.desFornecedor}">
<h:outputText value="#{item.desFornecedor}" />
</p:column>
<p:column width="90px;" headerText="Telefone">
<h:outputText value="#{item.nroFone}" />
</p:column>
<p:column width="60px;" headerText="Opção">
<p:commandButton
icon="ui-icon-pencil"
oncomplete="PF('dlgFornecedorManutencao').show();"
update=":frmFornecedorManutencao:pnlFornecedorManutencao">
<f:setPropertyActionListener
value="#{item}"
target="#{fornecedorBean.fornecedor}" />
</p:commandButton>
<p:commandButton
icon="ui-icon-trash"
oncomplete="PF('dlgFornecedorExclusao').show();"
update=":frmFornecedorExclusao:pnlFornecedorExclusao">
<f:setPropertyActionListener
value="#{item}"
target="#{fornecedorBean.fornecedor}" />
</p:commandButton>
</p:column>
<!--
<f:facet name="footer">
<p:commandButton
value="Incluir"
icon="ui-icon-plus"
actionListener="#{fornecedorBean.prepararInclusao}"
oncomplete="PF('dlgFornecedorManutencao').show();"
update=":frmFornecedorManutencao:pnlFornecedorManutencao" />
<span class="ui-separator">
<span class="ui-icon ui-icon-grip-dotted-vertical" />
</span>
<p:commandButton
id="btnSair"
icon="ui-icon-extlink"
value="Sair"
action="#{sistemaBean.telaSistema}" />
</f:facet>
-->
</p:dataTable>
<p:toolbar>
<f:facet name="right">
<p:commandButton
value="Incluir"
icon="ui-icon-plus"
actionListener="#{fornecedorBean.prepararInclusao}"
oncomplete="PF('dlgFornecedorManutencao').show();"
update=":frmFornecedorManutencao:pnlFornecedorManutencao" />
<!--
<span class="ui-separator">
<span class="ui-icon ui-icon-grip-dotted-vertical" />
</span>
-->
<p:commandButton
id="btnSair"
icon="ui-icon-extlink"
value="Sair"
action="#{sistemaBean.telaSistema}" />
</f:facet>
</p:toolbar>
</p:panel>
</h:form>
<!-- -->
<!-- -->
<!-- -->
<!-- Área de manutenção dos dados - Inclusão e Alteração -->
<p:dialog
header="Manutenção de Fornecedores"
widgetVar="dlgFornecedorManutencao"
closable="false"
draggable="false"
resizable="false"
modal="true"
appendTo="@(body)">
<!-- Formulário de manutenção - Inclusão e Alteração -->
<h:form id="frmFornecedorManutencao">
<h:panelGrid id="pnlFornecedorManutencao" columns="2" cellpadding="4">
<p:outputLabel value="Código:"/>
<p:outputLabel value="#{fornecedorBean.fornecedor.codFornecedor}" />
<p:outputLabel value="Nome:" for="desFornecedor"/>
<p:inputText
id="desFornecedor"
maxlength="100"
size="34"
value="#{fornecedorBean.fornecedor.desFornecedor}"
required="true"
requiredMessage="Informe o nome do fornecedor."/>
<p:outputLabel value="Telefone:"/>
<p:inputMask
id="nroTelefone"
maxlength="14"
size="12"
mask="(99) 9999-9999"
value="#{fornecedorBean.fornecedor.nroFone}" />
</h:panelGrid>
<h:panelGrid columns="2" cellpadding="4">
<p:commandButton
value="Gravar"
icon="ui-icon-disk"
actionListener="#{fornecedorBean.salvarDados}"
oncomplete="validarCampos(xhr, status, args, 'dlgFornecedorManutencao', 'tabFornecedorTabela');"
update=":frmFornecedorTabela:tabFornecedorTabela" />
<p:commandButton
value="Cancelar"
icon="ui-icon-cancel"
process="@this"
partialSubmit="true"
oncomplete="PF('dlgFornecedorManutencao').hide();" />
</h:panelGrid>
</h:form>
</p:dialog>
<!-- -->
<!-- -->
<!-- -->
<!-- Área de manutenção dos dados - Exclusão -->
<p:dialog
header="Exclusão de Fornecedor"
widgetVar="dlgFornecedorExclusao"
closable="false"
draggable="false"
resizable="false"
modal="true"
appendTo="@(body)">
<!-- Formulário de manutenção - Exclusão -->
<h:form id="frmFornecedorExclusao">
<h:panelGrid id="pnlFornecedorExclusao" columns="2" cellpadding="4">
<p:outputLabel value="Código:" />
<p:outputLabel value="#{fornecedorBean.fornecedor.codFornecedor}" />
<p:outputLabel value="Nome:" />
<p:outputLabel value="#{fornecedorBean.fornecedor.desFornecedor}" />
<p:outputLabel value="Telefone:" />
<p:outputLabel value="#{fornecedorBean.fornecedor.nroFone}" />
</h:panelGrid>
<h:panelGrid columns="2" cellpadding="4">
<p:commandButton
value="Confirmar"
icon="ui-icon-check"
actionListener="#{fornecedorBean.excluirDados}"
oncomplete="PF('dlgFornecedorExclusao').hide();"
update=":frmFornecedorTabela:tabFornecedorTabela" />
<p:commandButton
value="Cancelar"
icon="ui-icon-cancel"
process="@this"
partialSubmit="true"
oncomplete="PF('dlgFornecedorExclusao').hide();" />
</h:panelGrid>
</h:form>
</p:dialog>
</ui:define>
</ui:composition>
JAVASCRIPT:
function validarCampos(xhr, status, args, dlg, tab) {
if (args.validationFailed) {
PF(dlg).jq.effect("shake", {times:5}, 100);
} else {
PF(dlg).hide();
PF(dlg).clearFilters();
}
}