Pesquisei em alguns sites e vi alguns vídeos até finalmente achar um que me guiasse ao que tinha em mente, olhei cada trecho em si na hora de criar e agora estou tendo dificuldades em obter a confirmação, ele não dá erro em si, apenas fica carregando infinitamente não sei dizer sé e algum problema com o servidor, com a minha internet ou o código em si.
agradeço de antemão e qualquer sugestão.
Código Html :
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Formulario da Alura</title>
<link rel="stylesheet" href="style.css">
<script defer src = "script.js"></script>
</head>
<body>
<form id="form"
action="https://formsubmit.co/kmg.macedo2305@gmail.com" method="POST"
data-form>
<label for="nome">Nome</label>
<input type="text" name="nome" id="nome" required>
<label for="telefone">Celular</label>
<input type="tel" name="Celular" id="fone" placeholder="(xx) xxxx-xxxx" required>
<label for="email">E-mail</label>
<input type="email" name="email" id="email" required>
<label for=""mensagem>Mensagem</label>
<textarea name="mensagem" id="mensagem" required></textarea>
<button type="submit" data-button ;>Enviar</button>
</form>
</body>
</html>
Codigo em JavaScript :
class FormSubit {
constructor (settings) {
this.settings = settings;
this.form = document.querySelector(settings.form);
this.formButton = document.querySelector(settings.button);
if (this.form) {
this.url = this.form.getAttribute("action");
}
}
displaySucess() {
this.form.innerHTML = this.settings.sucess;
}
displayError() {
this.form.innerHTML = this.settings.error;
}
init() {
if(this.form) this.formButton.addEventListener("click", () => this.displaySucess());
return this;
}
}
const formSubmit = new FormSubmit({
form: "[data-form]" ,
button: "[data-buttton]",
sucess: "<h1 class = 'sucess' >Mensagem enviada!! </h1>",
error: "<h1 class = 'error' >Não foi possível enviar sua mensagem.</h1>",
})
formSubmit.init();
