Error in ajax when sending by mobile

0

Good evening, I have the following ajax:

jQuery('#form-contato').submit(function(){

    var nome  = $(this).find('[name="nome"]').val();
    var email = $(this).find('[name="email"]').val();
    var assunto   = $(this).find('[name="assunto"]').val();
    var mensagem   = $(this).find('[name="mensagem"]').val();

    var dados = "&nome=" + nome + "&email=" + email + "&assunto=" + assunto + "&mensagem=" + mensagem;

    jQuery.ajax({
        type: "POST",
        url: "send_contato.php",
        async: true,
        data: dados,
        success: function(data){
          openModal(nome + ", sua mensagem foi enviada com sucesso, em breve entraremos em contato!","success");            
        },
        error: function(data){
            openModal("Houve um erro","error");            
        }
    });

    return false;
});

It works on the desktop, but on the phone it always triggers an error message, and the email arrives empty.

    
asked by anonymous 10.12.2016 / 05:02

1 answer

0

It should be the lack of encode in the variables:

var dados = "&nome=" + encodeUri(nome) + "&email=" + encodeUri(email) + "&assunto=" + encodeUri(assunto) + "&mensagem=" + encodeUri(mensagem);

However this is difficult, you may prefer {} , so jQuery already encodes itself, another thing you can do is debug the error, like this:

error: function(xhr, textStatus, thrownError) {
    openModal("Houve um erro", "Erro (" + xhr.status +") - detalhes: " + textStatus);
}

The whole code should look like this:

jQuery('#form-contato').submit(function(){

    var nome  = $(this).find('[name="nome"]').val();
    var email = $(this).find('[name="email"]').val();
    var assunto   = $(this).find('[name="assunto"]').val();
    var mensagem   = $(this).find('[name="mensagem"]').val();

    var dados = {
        "nome": nome,
        "email": email,
        "assunto": assunto,
        "mensagem": mensagem
    };

    jQuery.ajax({
        type: "POST",
        url: "send_contato.php",
        async: true,
        data: dados,
        success: function(data){
          openModal(nome + ", sua mensagem foi enviada com sucesso, em breve entraremos em contato!","success");
        },
        error: function(xhr, textStatus, thrownError) {
            openModal("Erro (" + xhr.status +") - detalhes: " + textStatus, "error");
        }
    });

    return false;
});

Another thing, you can change success and error by .done and .fail (async is already true by default):

var dados = {
    "nome": nome,
    "email": email,
    "assunto": assunto,
    "mensagem": mensagem
};

jQuery.ajax({
    type: "POST",
    url: "send_contato.php",
    data: dados
})
.done(function(data){
  openModal(nome + ", sua mensagem foi enviada com sucesso, em breve entraremos em contato!","success");
})
.fail(function(xhr, textStatus, thrownError) {
    openModal("Erro (" + xhr.status +") - detalhes: " + textStatus, "error");
});
    
10.12.2016 / 06:36