Bug $.post

Na construção de funções que utilizam os métodos para ajax do jquery, notei que existem diferenças na passagem de parâmetros.

Que diferenças são essas ?

De acordo com a documentação do jquery você realizar uma requisição ajax através dos métodos:

jQuery.ajax()
jQuery.get()
jQuery.post()

O método jQuery.ajax() ou $.ajax() realizam uma requisição ajax podendo ser GET ou POST. O método jQuery.get() realiza uma requisição GET para carregar dados do servidor, é uma "abreviação" do método $.ajax, ou seja, é equivalente à:

$.ajax({
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

Finalmente o método jQuery.post() realiza uma requisição POST para carregar dados do servidor, é uma "abreviação" do método $.ajax, ou seja, é equivalente à:


$.ajax({
  type: "POST",
  url: url,
  data: data,
  success: success,
  dataType: dataType
});


Vamos analisar aqui o método $.post(). Nesse método podemos passar parâmetros de duas formas, a primeira forma é via uma string, exemplo:

function foo(){
       var valor1 = 1;
       var valor2 = 'Joao Paulo';
       $.post("sua_url", "parametro1=" + valor1 + '&parametro2=' + valor2,
                 function(retornoAjax){},
       "html");
}

Nesse exemplo, realizamos uma requisição ajax ao servidor passando dois parâmetros. Quando esses dados chegarem no servidor, o parametro1 vai chegar com o valor "1" e o parametro2 vai chegar com o valor "Joao Paulo". A integridade dos dados vai ser mantida mas, se mudarmos só um pouco o exemplo teremos um problema.


function foo(){
       var valor1 = 1;
       var valor2 = 'João Paulo';
       $.post("sua_url", "parametro1=" + valor1 + '&parametro2=' + valor2,
                 function(retornoAjax){},
       "html");
}

Quando esses dados chegarem no servidor, o parametro1 vai continuar com o valor 1 mas, o parametro2 vai vir com caracteres estranhos, "quebrados", quadradinhos e afins. Para solucionar esse problema, temos que passar os parâmetros de uma outra forma, via JSON. Passando os parâmetros via JSON, conseguimos manter a integridade dos dados quando eles chegam no servidor. Para passar parâmetros via JSON, teremos de modificar um pouco nossa função.


function foo(){
       var valor1 = 1;
       var valor2 = 'João Paulo';
       $.post("sua_url", {parametro1: valor1, parametro2: valor2},
                 function(retornoAjax){},
       "html");
}

Caso você tenha dúvidas de como trabalhar com JSON, recomendo dar uma lida em outro post aqui do blog. Desse jeito podemos manter a integridade dos nossos dados e, o valor do parametro2 chegar no servidor como "João Paulo". Podemos também alterar um pouco mais nossa função caso queiramos passar mais parâmetros.


function foo(){
       var valor1 = 1;
       var valor2 = 'João Paulo';
       var parametros = {

      'parametro1' : valor1,
              'parametro2' : valor2
       };
       $.post("sua_url", parametros,

                 function(retornoAjax){},
       "html");
}