Por que, ao renderizar uma vez certos componentes, eles perdem suas funções?
Por exemplo, não estou conseguindo salvar e enviar um formulário para o Bean sem colocar o f:ajax…
Desta forma, executei e renderizei todo o @form… Mas agora todas as funções javascript do formulário se perderam.
Sempre que renderizo algum campo, botão, eles param de funcionar, só funcionam na primeira vez.
O que pode ser?
Tem o código amigo?
Basicamente é assim que funciona:
Tenho um pequeno formulário de cadastro, com alguns inputs e selects. Posso pesquisar do banco, pelo cpf do cliente, seus dados, que são carregados por ajax.
O que acontece é o seguinte, se eu colocar qualquer evento javascript em um input ou select que for renderizado nesta consulta, eu perco a função.
Ou seja, tenho essa função para um input:
var cpf= $("#cpfCliente");
cpf.on(“click”,function() {
console.log(“teste”);
}
Quantos clicks eu der irá funcionar. Após eu carregar o cliente, aquele input é renderizado pelo ajax, com os dados trazidos pelo banco, e aí a função para de funcionar. Isso tá acontecendo comigo com qualquer uso do ajax do jsf.
Eu já pesquisei, falavam de usar o antigo .live(), que agora é o on()… mas continua não funcionando… já botei o proprio campo como segundo parametro da função, e nada…
Ja passei por um problema semelhante, não sei se a solução que achei é a melhor mas resolveu pra mim.
Coloquei os códigos javascript dentro de um h:panelGroup e quando usava o ajax pra rendenizar um componente que tinha um javascript atrelado a ele eu mandava rendenizar o panel dos scripts também.
Tipo :
<h:commandLink action="#{bean.salvar()}">
<f:ajax execute="@form" render=":id-do-que-deve-ser-atualizado :scripts"/>
</h:commandLink>
...
...
...
<h:panelGroup id="scripts">
<!-- aqui carrego os scripts -->
</h:panelGroup>
Não sei se essa é a melhor prática.