Comment passer des paramètres dans $ajax POST ?

Question

J'ai suivi le tutoriel comme indiqué dans this lien. Dans le code ci-dessous, pour une raison quelconque, les données ne sont pas ajoutées à l'url en tant que paramètres, mais si je les place directement dans l'url en utilisant la fonction /?field1="hello" ça marche.

$.ajax({
        url: 'superman',
        type: 'POST',
        data: { field1: "hello", field2 : "hello2"} ,
        contentType: 'application/json; charset=utf-8',
        success: function (response) {
            alert(response.status);
        },
        error: function () {
            alert("error");
        }
    });

Answer 1

Je vous recommande d'utiliser le $.post o $.get syntaxe de jQuery pour les cas simples :

$.post('superman', { field1: "hello", field2 : "hello2"}, 
    function(returnedData){
         console.log(returnedData);
});

Si vous avez besoin d'attraper les cas d'échec, faites simplement ceci :

$.post('superman', { field1: "hello", field2 : "hello2"}, 
    function(returnedData){
         console.log(returnedData);
}).fail(function(){
      console.log("error");
});

De plus, si vous envoyez toujours une chaîne de caractères JSON, vous pouvez utiliser la fonction $.getJSON ou $.post avec un paramètre supplémentaire à la toute fin.

$.post('superman', { field1: "hello", field2 : "hello2"}, 
     function(returnedData){
        console.log(returnedData);
}, 'json');

Answer 2

Jquery.ajax ne code pas automatiquement les données POST comme il le fait pour les données GET. Jquery s'attend à ce que vos données soient préformées et ajoutées au corps de la requête pour être envoyées directement sur le fil.

Une solution consiste à utiliser le jQuery.param pour construire une chaîne de requête que la plupart des scripts qui traitent les requêtes POST attendent.

$.ajax({
    url: 'superman',
    type: 'POST',
    data: jQuery.param({ field1: "hello", field2 : "hello2"}) ,
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
    success: function (response) {
        alert(response.status);
    },
    error: function () {
        alert("error");
    }
}); 

Dans ce cas, le param permet de formater les données :

field1=hello&field2=hello2

---

El Jquery.ajax indique qu'il existe un drapeau appelé processData qui contrôle si cet encodage est fait automatiquement ou non. La documentation indique que la valeur par défaut est true mais ce n'est pas le comportement que j'observe lorsque POST est utilisé.

Answer 3

Essayez d'utiliser la méthode GET,

var request = $.ajax({
    url: 'url',
    type: 'GET',
    data: { field1: "hello", field2 : "hello2"} ,
    contentType: 'application/json; charset=utf-8'
});

request.done(function(data) {
      // your success code here
});

request.fail(function(jqXHR, textStatus) {
      // your failure code here
});

Vous ne pouvez pas voir les paramètres dans l'URL avec la méthode POST.

Edit :

Avis de dépréciation : Les fonctions jqXHR.success(), jqXHR.error() et jqXHR.complete() ont été supprimés à partir de jQuery 3.0. Vous pouvez utiliser jqXHR.done(), jqXHR.fail() et jqXHR.always() à la place.

Answer 4

    function FillData() {
    var param = $("#<%= TextBox1.ClientID %>").val();
    $("#tbDetails").append("<img src='Images/loading.gif'/>");
    $.ajax({
        type: "POST",/*method type*/
        contentType: "application/json; charset=utf-8",
        url: "Default.aspx/BindDatatable",/*Target function that will be return result*/
        data: '{"data":"' + param + '"}',/*parameter pass data is parameter name param is value */
        dataType: "json",
        success: function(data) {
               alert("Success");
            }
        },
        error: function(result) {
            alert("Error");
        }
    });   
}

Answer 5

Dans un Demande POST les paramètres sont envoyés dans le corps de la requête, c'est pourquoi vous ne les voyez pas dans l'URL.

Si vous voulez les voir, changez

    type: 'POST',

à

    type: 'GET',

Notez que les navigateurs ont des outils de développement qui vous permettent de voir les requêtes complètes que votre code émet. Dans Chrome, c'est dans le panneau "Réseau".