Wie übergebe ich Parameter in $ ajax POST?

Ich habe das Tutorial wie in diesem Link angegeben befolgt . Im folgenden Code werden die Daten aus irgendeinem Grund nicht als Parameter an die URL angehängt, aber wenn ich sie direkt auf die URL setze, /?field1="hello"funktioniert dies.

$.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");
        }
    }); 

Ich würde Ihnen empfehlen, die $.postoder die $.getSyntax von jQuery für einfache Fälle zu verwenden:

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

Wenn Sie die Fehlerfälle abfangen müssen, gehen Sie wie folgt vor:

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

Wenn Sie immer eine JSON-Zeichenfolge senden, können Sie außerdem $ .getJSON oder $ .post mit einem weiteren Parameter ganz am Ende verwenden.

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

Versuchen Sie es mit der GET-Methode.

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
});

Mit der POST-Methode können keine Parameter in der URL angezeigt werden.

Bearbeiten:

Verfallshinweis : Die Rückrufe jqXHR.success (), jqXHR.error () und jqXHR.complete () werden ab jQuery 3.0 entfernt. Sie können stattdessen jqXHR.done (), jqXHR.fail () und jqXHR.always () verwenden.

Jquery.ajax codiert POST-Daten für Sie nicht automatisch wie für GET-Daten. Jquery erwartet, dass Ihre Daten vorformatiert sind, um an den Anforderungshauptteil angehängt zu werden und direkt über die Leitung gesendet zu werden.

Eine Lösung besteht darin, die Funktion jQuery.param zu verwenden, um eine Abfragezeichenfolge zu erstellen, die die meisten Skripts, die POST-Anforderungen verarbeiten, erwarten.

$.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");
    }
}); 

In diesem Fall paramformatiert die Methode die Daten wie folgt:

field1=hello&field2=hello2

In der Dokumentation zu Jquery.ajax heißt es, dass ein Flag mit dem Namen processDatasteuert, ob diese Codierung automatisch erfolgt oder nicht. In der Dokumentation wird standardmäßig angegeben true, aber dies ist nicht das Verhalten, das ich bei POSTVerwendung beobachte.

    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");
        }
    });   
}

Bei einer POST-Anforderung werden die Parameter im Hauptteil der Anforderung gesendet. Deshalb werden sie in der URL nicht angezeigt.

Wenn Sie sie sehen möchten, ändern Sie

    type: 'POST',

zu

    type: 'GET',

Beachten Sie, dass Browser über Entwicklungstools verfügen, mit denen Sie die vollständigen Anforderungen anzeigen können, die Ihr Code ausgibt. In Chrome befindet es sich im Bereich "Netzwerk".

$.ajax(
   {
      type: 'post',
      url: 'superman',
      data: { 
        "field1": "hello",
        "field2": "hello1"
      },
      success: function (response) {
        alert("Success !!");
      },
      error: function () {
        alert("Error !!");
      }
   }
);

type: 'POST'Wird ** Parameter angehängt an den Körper des Antrags ** , die sich gesehen nicht in der URL , während die type: 'GET'Parameter an die URL anhängt , die ist sichtbar .

Die meisten gängigen Webbrowser enthalten Netzwerkfenster, in denen die vollständige Anforderung angezeigt wird .

Wählen Sie im Netzwerkfenster XHR aus , um Anforderungen anzuzeigen .

Dies kann auch über dies erfolgen.

$.post('superman',
      { 
        'field1': 'hello', 
        'field2': 'hello1'
      },
      function (response) {
        alert("Success !");
      }
    );

Sie können dies mit $ .ajax oder $ .post tun

Verwenden von $ .ajax:

    $.ajax({
      type: 'post',
      url: 'superman',
      data: { 
        'field1': 'hello', 
        'field2': 'hello1'
      },
      success: function (response) {
        alert(response.status);
      },
      error: function () {
        alert("error");
      }
   });

Verwenden von $ .post:

    $.post('superman',
      { 
        'field1': 'hello', 
        'field2': 'hello1'
      },
      function (response, status) {
        alert(response.status);
      }
    );

Ihr Code war richtig, außer dass Sie die JSON-Schlüssel nicht als Zeichenfolgen übergeben.

Es sollte doppelte oder einfache Anführungszeichen enthalten

{"field1": "hallo", "field2": "hallo2"}

$.ajax(
   {
      type: 'post',
      url: 'superman',
      data: { 
        "field1": "hello", // Quotes were missing
        "field2": "hello1" // Here also
      },
      success: function (response) {
        alert(response);
      },
      error: function () {
        alert("error");
      }
   }
);

Zum Senden von Parametern in der URL in POSTMethode Sie können sie einfach wie folgt an die URL anhängen:

$.ajax({
    type: 'POST',
    url: 'superman?' + jQuery.param({ f1: "hello1", f2 : "hello2"}),
    // ...
});