0

Na pergunta passada (XMLHttpRequest não encontra executa) estava com dificuldade o que estava dando errado em meu código, então eu segui alguns tutoriais no youtube para ver como é a demonstração na prática, entretanto não funcionou nada, parece que ele não lê os comandos XMLHttpRequest.

JS

window.onload = () => {

    //Constantes que são pegas do Formulário
    const name = document.getElementById('name');
    const mail = document.getElementById('mail');
    const message = document.getElementById('message');
    const sendMessage = document.getElementById('sendMessage');
    const regex = /[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/
    sendMessage.addEventListener('click', (e) => {

        //Validação de Nome
        if (name.value == undefined || name.value == "" || name.value == null) {
            alert('Nome não corresponde com o campo');
            name.focus();
            e.preventDefault();
        }
        //Validação de E-mail
        if (regex.test(!mail.value) || mail.value == "" || mail.value == undefined || mail.value == null) {
            alert('E-mail não corresponde com o campo');
            mail.focus();
            e.preventDefault();
        }
        //Validação de mensagem
        if (message.value == undefined || message.value == "" || message.value == undefined) {
            alert('Mensagem não corresponde com o campo');
            message.focus();
            e.preventDefault();

            //Se todas as condições forem aprovadas então vai enviar as informações do e-mail e o regex
            //para o mail.php

        } else {
            function reqListener () {
                console.log(this.responseText);
              }

              var oReq = new XMLHttpRequest();
              oReq.addEventListener("load", reqListener);
              oReq.open("GET", "http://www.example.org/example.txt");
              oReq.send();
            /*
            Isso deve ser feito após o processo do XMLHTTPREQUEST dar certo
            alert('Enviado com sucesso');
            sendMessage.style.display = 'none';
            name.value = ' '
            mail.value = ' '
            message.value = ' '
            */

        }

    });

}

A parte do XMLHttpRequest eu peguei da internet como exemplo da própria MDN, mas não funcionou, não dá erro e nem retorna nada, como se não tivesse as instruções. Esse erro está no fato de algum erro antes do XMLHttpRequest?

2
  • Abre o DevTools do Google Chrome e vai na aba Network para ver se ele de fato tentou enviar uma requisição ou se nem isso...
    – MonneratRJ
    Commented 4/04/2019 às 20:05
  • Então @MonneratRJ, nem requisição ele está enviando. Parece que o XMLHttpRequest nem existe (eu já dei um console.log no objeto e retornou normalmente, mas o resto dos comandos n funcionam) Commented 5/04/2019 às 11:25

1 Resposta 1

0

Olá eu mudaria seu código para:

window.onload = () => {

    //Constantes que são pegas do Formulário
    const name = document.getElementById('name');
    const mail = document.getElementById('mail');
    const message = document.getElementById('message');
    const sendMessage = document.getElementById('sendMessage');
    const regex = /[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/
    sendMessage.addEventListener('click', (e) => {

        //Validação de Nome
        if (name.value == undefined || name.value == "" || name.value == null) {
            alert('Nome não corresponde com o campo');
            name.focus();
            e.preventDefault();
        }
        //Validação de E-mail
        if (regex.test(!mail.value) || mail.value == "" || mail.value == undefined || mail.value == null) {
            alert('E-mail não corresponde com o campo');
            mail.focus();
            e.preventDefault();
        }
        //Validação de mensagem
        if (message.value == undefined || message.value == "" || message.value == undefined) {
            alert('Mensagem não corresponde com o campo');
            message.focus();
            e.preventDefault();

            /*
            Se todas as condições forem aprovadas então vai enviar as informações
            do e-mail e o regex para o mail.php
            */

        } else {
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {
                    /*
                    Isso deve ser feito após o processo do XMLHTTPREQUEST dar certo
                    alert('Enviado com sucesso');
                    sendMessage.style.display = 'none';
                    name.value = ' '
                    mail.value = ' '
                    message.value = ' '
                    */
                } else {
                    /*
                    Não entendi a necessidade do reqListener, mas coloquei para gerar
                    logs das alterações dos status da request.
                    */
                    console.log(this.responseText);
                }
            }

            // Lembrar de alterar a URL (o 2o parâmetro) para algo válido
            xhr.open('GET', 'http://www.google.com/', true);
            xhr.send(null);

        }
    });
}

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .