Multiple parameters in xmlhttp.send ();

1

I'm doing an insert in the database with ajax, ajax is working, but the insertion is not being done correctly, I believe it's because I'm passing the parameters incorrectly in the send (); I need to get the name and age in the method. Here is the code:

HTML:

<h1> Cadastre-se em nosso site </h1>
    <div id="exibeCont"></div>

        <form action="servico.php?p=cadUsr" method="POST" id="frmCadUsr">
            Nome: <input type="text" maxlength="255" name="txtNome" id="txtNome"/>
            Idade: <input type="text" maxlength="3" name="txtIdade" id="txtIdade"/>

            <input type="submit" value="Enviar" />
        </form>

PHP:

function cadUsr(){
    require("dbCon.php");
    require("mdl_usuario.php");

        $usr = $_POST["txtNome"];
        $idade = $_POST["txtIdade"];

        $resultado = usuario_cadastrar($con,$usr,$idade);

            if($resultado){
                echo "Cadastro efetuado com sucesso";
            } else {
                echo "O cadastro falhou";
            }
    }

PHP function to insert:

function usuario_cadastrar($conexao,$nome,$idade){


        if($nome == "" && $idade == ""){
            return false;
        }





        $sql = sprintf("insert into usuario (nome,idade) values ('%s',%s)",$nome,$idade);

        $resultado = mysqli_query($conexao,$sql);

            return $resultado;
    }

And AJAX:

window.onload = function(){

            var xmlhttp;
            var frm = document.querySelector("#frmCadUsr");
            var url = frm.getAttribute("action");
            var nm = document.querySelector("#txtNome").value;
            var idade = document.querySelector("#txtIdade").value;

            frm.addEventListener("submit",function(e){
                e.preventDefault();

                try{
                    if(window.XMLHttpRequest){
                        xmlhttp = new XMLHttpRequest();
                    }

                    xmlhttp.open("POST",url,true);
                    xmlhttp.send(nm+idade);

                    xmlhttp.onreadystatechange = function(){
                        if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
                            alert("Deu certo");
                        }
                    }
                } catch(err){
                    alert("Ocorreu um erro.<br />"+ err);
                }
            });

}

I get the alert with the message "It worked," but the insertion is not performed.

    
asked by anonymous 01.08.2015 / 20:04

3 answers

1

In addition to than @sergio mentioned , it was missing the xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); header.

This header defaults to all forms in html, but when you disable the form default, it loses this value. I removed the form and left only the text fields, and added it. The função ajax() looks like this:

function ajax(){

            var xmlhttp;    
            var nm = document.querySelector("#txtNome").value;
            var idade = document.querySelector("#txtIdade").value;

                try{
                    if(window.XMLHttpRequest){
                        xmlhttp = new XMLHttpRequest();
                    }

                    xmlhttp.open("POST","servico.php",true);

                    /*setRequestHeader(Content-type, application/x-www-form-urlencoded), esta
                    função adiciona ao cabeçalho que o request feito ao servidor será um conteudo,
                    e o conteudo sera levado pela url como em um form.
                    o application/x-www-form-urlencoded é um dos cabeçalhos para enviar dados
                    através de HTTP. Ele faz com o que os dados enviados sejam guardados em uma
                    querystring(parametros de url), e é essencial quando se envia um dado para
                    o servidor.

                    Para enviar um dado para o servidor é necessário atribuir algum tipo de
                    cabeçalho para o HTTP.*/
                    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
                    xmlhttp.send("txtNome=" + nm + "&txtIdade="+idade + "&p=cadUsr");

                    xmlhttp.onreadystatechange = function(){
                        if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
                            alert("Deu certo");
                            //console.log(xmlhttp.responseText);
                        }
                    }
                } catch(err){
                    alert("Ocorreu um erro.<br />"+ err);
                }
}
    
02.08.2015 / 01:25
0

You have to put the data you want to send in query string format. That is:

chave1=valor1&chave2=valor2

So in% of nm + idade you should use this way:

var dados = 'txtNome=' + nm + '&txtIdade=' + idade;
xmlhttp.send(dados);
    
01.08.2015 / 22:30
0

I was having difficulties with mine too, there I put the suggested code:

 xmlreq.open("POST","inserir.php",true);
 xmlreq.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
 var dados = 'questao=' + num + '&resposta=' + resposta;  //dados que estou enviando
 xmlreq.send(dados); //xmlreq = xmlhttp

It worked correctly, thank you. If your is not sending take a look at the fields of the database, those that are NOT NULL or VARCHAR are receiving values accordingly.

    
09.10.2018 / 04:13