Olá, gostaria de saber como posso fazer a validação do formulário de contato, de preferência com ajax.
Verei isso mais a frente no curso?
Aguardo o retorno.
Olá, gostaria de saber como posso fazer a validação do formulário de contato, de preferência com ajax.
Verei isso mais a frente no curso?
Aguardo o retorno.
Você até poderia modificar o código do wordpress, ou de um determinado plugin para implementar a validação do formulário. Mas, não recomendo fazer isso.
O Wordpress e seus plugins, recebem novas atualizações e correções com o passar do tempo, se você alterar hoje o código do Wordpress ou de um de seus plugins, ao realizar uma atualização a alteração que você fez no código será substituída pelo novo arquivo atualizado, e você terá que fazer a alteração novamente.
Uma boa forma de validar um formulário do Wordpress é pesquisar por um plugin de formulário que contenha a opção de validação ja incluída. Uma boa dica é o plugin "Ninja Forms".
Ou desenvolver você mesmo um plugin para isso.
Aqui tem um tutorial sobre o Ninja Forms
https://www.canalwp.com/plugins-wordpress/formulario-contato-ninja-forms-wordpress/
Existe um pago que parece fazer isso, que é o Gravity Forms
http://www.gravityforms.com
Wagner, Daniel, obrigado pelo retorno.
Como estou começando a utilizar os fóruns da Alura, ainda não estou muito acostumado com os procedimentos aqui.
Eu formulei essa questão a partir do curso: Wordpress: Criação de um tema do zero, na aula 04, vídeo 3, onde o instrutor exibe a criação de um formulário de contato, mas não faz os procedimentos de validação.
Atualmente eu utilizo o contact form 7, e ele funciona muito bem, no entanto a única coisa que não me agrada é o fato de que eu não consigo fazer ele funcionar sem recarregar a página.
Em outro tópico que solicitei por aqui, fui indicado a utilizar o console do chrome, para perceber alguma falha no Javascript, mas nada aparece.
Como informei anteriormente, ele envia os e-mails com perfeição, gera mensagem de sucesso ou falha, faz a validação de dados... meu problema está no reload da página junto a "sujeira" que ele deixa na url ("site.com.br/contato/#wpcf7 + tipo de erro")
Eu acredito que como eu desenvolvi meu tema totalmente do zero, deve ter algum código em PHP ou JS que eu não inseri para que o Ajax do formulário funcione corretamente, porque o "CF7" não produz o mesmo erro em temas nativos do "WP".
Se vocês puderem me ajudar com essa questão, ficarei agradecido.
Att. Denis R. Dib
Olá Denis!
Ficou difícil pra mim entender o problema, é possível você compactar os arquivos do site e gravar no google drive, postando o link para download aqui?
Com os arquivos aqui eu posso simular o erro e tentar te ajudar a resolver.
Para validar o formulário usando Javascript e o Contact Form 7 você pode tentar o seguinte, primeiro, criar um ID para o formulário, isso você consegue fazer direto no shortcode, basta ver este exemplo:
http://contactform7.com/faq/can-i-add-id-and-class-attributes-to-a-form-element/
Depois, você pode criar um arquivo javascript próprio e adicionar no seu tema. Será necessário criar um listener para o formulário, supondo que o seu formulário chame "form1", o código ficaria assim.
try {
document.getElementById("form1").addEventListener("submit", checkform_meuform, false);
} catch (error) {
//O form nao existe na pagina que foi acessada
}
Um exemplo de como validar apenas 1 campo com o nome "your-name":
function checkform_meuform (e) {
var form = e.target;
var continuar = true;
var mensagem = "Ocorreram os seguintes erros:\n"
form.elements["your-name"].style.backgroundColor='#FFFFFF';
if (form.elements["your-name"].value == "") {
mensagem = mensagem + 'Por favor informe o seu nome\n';
form.elements["your-name"].style.backgroundColor='#FFFF99';
continuar = false;
}
if (continuar) {
return true;
} else {
alert(mensagem);
e.preventDefault();
return false;
}
}
Wagner, obrigado pelo retorno. Pelo Contact Form 7 eu encontrei a resposta. Para que o Ajax possa rodar na validação do formulário, bastava inserir um "<?php wp_head(); ?>" antes de concluir o header e um "<?php wp_footer(); ?>" antes de fechar o body.
Daniel, obrigado pelo retorno. Eu tentarei utilizar a solução que você propôs sem utilizar o plugin. Muito obrigado por enquanto.