[RESOLVIDO] JQuery conflita com jsf2

JavaChild Membro desde: 24/08/2007 10:46:42 Mensagens: 111 Offline

Boa noite caros amigos, tenho uma aplicação em JSF 2, utilizo o Prime Faces... Estah dando conflito entre o inputText do prime ou da biblioteca h com o JQuery quando tento validar um campo qto ao seu preenchimento ("required:true"):

Desta forma que estah codificado o comandButton localizado no final do formulário para realizar o cadastro não funciona.
Simplesmente o submit não acontece.
Se eu manter a mesma lógica e colocar este botão noutro Formulário ele funciona mas a validação também não procede.

Código completo:

<h:head>
	<h:outputScript library="javascript" name="jquery.js" target="head" />
	<h:outputScript library="javascript"
		name="jquery.maskedinput-1.1.4.pack.js" target="head" />
	<h:outputScript library="javascript" name="jquery.validate.js"
		target="head" />
	<h:outputScript library="javascript" name="funcoes.js" target="head" />

$j("#txtTelefone").mask("99-9999-9999");
			$j("#txtCpf").mask("999.999.999-99");

$j("#formCadastroFuncionario").validate({
				// Define as regras
				rules : {
					txtCpf : {
						cpf : true
					},
					txtEmail : {
						email : true
					},
					txtConfirmaSenha : {
						equalTo : "#txtSenha",
						required : true
					},
					txtSenha : {
						padraoSenha : true
					}

},
				// Define as mensagens de erro para cada regra
				messages : {
					txtCpf : {
						cpf : "CPF invalido"
					},
					txtEmail : {
						email : "Email invalido"
					},
					txtConfirmaSenha : {
						equalTo : "A senha não foi confirmada"
					}

}
			// fim mensagens

});//fim validate
		});//fim jquery
	</script>
</h:head>

<h:body>
	<div id="form">
		<h:form prependId="false">
			<h:commandLink value="Voltar" action="#{FuncionarioBean.doVoltar}"
				id="cmdVoltar" />
		</h:form>

<h:form id="formCadastroFuncionario" prependId="false">
			<p:fieldset legend="Cadastro de Usuário">

<mj:focus for="Setor:*" />
				<h:panelGrid columns="3" cellpadding="1" border="0" width="40%">

<h:outputLabel id="lblSetor" value="Setor:*"/>
					<h:selectOneMenu
						value="#{FuncionarioBean.funcionario.estruturaOrganizacional.idUnidade}"
						id="txtSetor">
						<f:selectItems value="#{FuncionarioBean.listaSetores}" var="lista"
							itemLabel="#{lista.nmSglUnidade}" itemValue="#{lista.idUnidade}" />
					</h:selectOneMenu>
					<h:message for="txtSetor" styleClass="lbCampos" />

<h:outputLabel id="lblTipoUsuario" value="Tipo Usuário:*"/>
					<h:selectOneMenu value="#{FuncionarioBean.tipoUsuario}"
						id="txtTipoUsuario">
						<f:selectItem itemValue="A" itemLabel="Administrador" />
						<f:selectItem itemValue="D" itemLabel="Diretor" />
						<f:selectItem itemValue="G" itemLabel="Gerente de Divisão" />
						<f:selectItem itemValue="F" itemLabel="Funcionário" />
						<f:selectItem itemValue="E" itemLabel="Estagiário" />
					</h:selectOneMenu>
					<h:message for="txtTipoUsuario" />

<h:outputLabel id="lblNome" value="Nome:*" />
					<p:inputText id="txtNome"
								 value="#{FuncionarioBean.funcionario.nmFuncionario}"
						         maxlength="50" 
							     required="true" 
								 requiredMessage="Informe o nome do Funcionario!"/>
					<p:message for="txtNome" />
 
					<h:outputLabel id="lblCpf" value="CPF:*" />
					<h:inputText id="txtCpf"
						value="#{FuncionarioBean.funcionario.nrCpf}"  />
					<p:message for="txtCpf" />

<h:outputLabel id="lbltelefone" value="Telefone:*"/>
					<h:inputText id="txtTelefone"
						value="#{FuncionarioBean.funcionario.nmFone}" />
					<h:message for="txtTelefone"/>

<h:outputLabel id="lblCodigoCracha" value="Código Carchá:*" />
					<h:inputText id="txtCodigoCracha"
						value="#{FuncionarioBean.funcionario.idCracha}" maxlength="20" />
					<h:message for="txtCodigoCracha"/>

<h:outputLabel id="lblEmail" value="email:*"/>
					<h:inputText id="txtEmail" value="#{FuncionarioBean.funcionario.nmEmail}" maxlength="30"/>
					<h:message for="txtEmail" styleClass="lbCampos" />

<h:outputLabel id="lblMatricula" value="matrícula:*"/>
					<h:inputText id="txtMatricula"
						value="#{FuncionarioBean.funcionario.nmMatFuncionario}"
						maxlength="20" />
					<h:message for="txtMatricula" styleClass="lbCampos" />

<h:outputLabel id="lblLogin" value="Usuário:*"/>
					<h:inputText id="txtLogin" value="#{FuncionarioBean.login}"
						maxlength="10">
						<f:ajax execute="txtLogin" render="txtNmLogin" />
					</h:inputText>

<h:outputLabel></h:outputLabel>
					<h:outputLabel></h:outputLabel>

<h:outputText id="txtNmLogin" class="error"
						value="#{FuncionarioBean.verificaDisponibilidade}" />
					<h:message for="lblLogin" styleClass="lbCampos" />

<h:outputLabel id="lblSenha" value="Senha:*"/>
					<h:inputSecret id="txtSenha" value="#{FuncionarioBean.senha}"
						maxlength="20"/>
					<h:message for="txtSenha" styleClass="lbCampos" />

<h:outputLabel id="lblConfirmaSenha" value="Confirmar Senha:*" />
					<h:inputSecret id="txtConfirmaSenha" maxlength="20" />
					<h:message for="txtConfirmaSenha" styleClass="lbCampos" />
					<p:commandButton type="submit" value="Cadastrar" action="#{FuncionarioBean.doEnviar}" />
					<p:commandButton type="reset" value="Limpar" action="#{FuncionarioBean.limparCampos}" />
					<h:outputLabel value="#{FuncionarioBean.msg}"
						rendered="#{FuncionarioBean.exibeMensagem}" />
				
				</h:panelGrid>
			</p:fieldset>
		</h:form>
	</div>

</h:body>
</html>

Alguém poderia me ajudar?
Um abraço e obrigado pela atenção....

Foi um dos motivos que me fez abandonar o JSF

This message was edited 1 time. Last update was at 01/09/2011 17:42:10

para que validar via jquery sendo que no jsf 2, utilizando o primefaces como você está, você faz a verificação adequada ao campo?

no seu código:

com o primefaces:

se a pessoa não preencher todos os dígitos, ele nem vai guardar o valor no input.
olha o exemplo do primefaces neste link

outro detalhe que eu esqueci, para a validação ocorrer via ajax, você temq ue dar um update no teu formulário, que é onde consta o <p:messages /> e a sua ação do commandButton tem que ser ajax (ajax="true")

só não pode desistir por falta de atenção ^^

JavaChild Membro desde: 24/08/2007 10:46:42 Mensagens: 111 Offline

Nem precisou de colocar ajax="true", só com o update na msg já funcionou, só que a msg que é impressa está sendo uma msg padrão do Prime, não é a minha requiredMessage.

JavaChild Membro desde: 24/08/2007 10:46:42 Mensagens: 111 Offline

Agora está funcionando completamente, acho que era cache de quando eu testei sem colocar a requiredMessage. OBrigado pela atenção!

coloca uma flag no teu tópico para indicar resolução [RESOLVIDO]

Notícias, artigos e o maior fórum brasileiro sobre Java