Como enviar mais de um valor em AJAX

[douglaslelis 0]

Olá!

 

tenho o seguinte HTML (resumido):

 

<div id="dados"></div>

 

<input id="cep" name="cep" />

 

 

<button type="button" id="buscar">Buscar</button>

 

 

 

Tenho essa seguinte função em ajax:

 

 

function buscar(cep)
            {
                var page = "exe/calcula.frete.php";
                $.ajax
                        ({
                            type: 'POST',
                            dataType: 'html',
                            url: page,
                            beforeSend: function () {
                                $("#dados").html("Calculando...");
                            },
                            data: {cep: cep},
                            success: function (msg)
                            {
                                $("#dados").html(msg);
                            }
                        });
            }
            
            
            $('#buscar').click(function () {
                buscar($("#cep").val())
            });

 

 

ela pega valores do id "cep", que é um input, e envia para o arquivo exe/calcula.frete.php (POST) ...

 

funciona perfeitamente, porém, eu gostaria de enviar dois ou mais valores nessa mesma função, por exemplo: rua, numero, etc...

 

 

tentei o seguinte mas não funcionou:

 

 

<input id="cep" name="cep" />

<input id="rua" name="rua" />

<input id="numero" name="numero" />

 

 

 

function buscar(cep, rua, numero)
            {
                var page = "exe/calcula.frete.php";
                $.ajax
                        ({
                            type: 'POST',
                            dataType: 'html',
                            url: page,
                            beforeSend: function () {
                                $("#dados").html("Calculando...");
                            },
                            data: {cep: cep, rua: rua, numero: numero},
                            success: function (msg)
                            {
                                $("#dados").html(msg);
                            }
                        });
            }
            
            
            $('#buscar').click(function () {
                buscar($("#cep", "#rua", "#numero").val())
            });

 

 

 

Alguém pode me ajudar por favor ?

 

[Wesley Santos 28]

Acredito que o problema está nessa parte:

$('#buscar').click(function () {
  buscar($("#cep", "#rua", "#numero").val())
});

 

Tente assim:

 

$('#buscar').on('click', function () {
	let cep    = $("#cep").val();
    let rua    = $("#rua").val();
    let numero = $("#numero").val();

	buscar(cep, rua, numero);
});

 

[douglaslelis 0]

@Wesley Santos

valeu cara! era ali mesmo o erro.. 

o código que você me passou tava com dando erro de sintaxe, então troquei o "let" por "var" .. e a linha 

$('#buscar').on('click', function () {

troquei por

$('#buscar').click(function () {

e ai deu tudo certo, agora tá passando os valores e retornando tudo certinho na DIV.

 

valeu!

[Wesley Santos 28]

Bacana!
Acredito que o .on deu erro por conta da sua versão do jQuery, se quiser da uma lida na documentação e atualiza ele.

- http://api.jquery.com/on/

 

Em questão ao let por var, se quiser da uma lida sobre o assunto também.

- https://medium.com/@raphalima8/variáveis-em-es6-var-let-e-const-como-funcionam-e-qual-delas-usar-413938f732f9