Làm cách nào để truyền tham số trong $ ajax POST?

Tôi đã làm theo hướng dẫn như đã nêu trong liên kết này . Trong mã dưới đây vì một số lý do, dữ liệu không được thêm vào url dưới dạng tham số, nhưng nếu tôi đặt chúng trực tiếp vào url bằng cách sử dụng /?field1="hello"thì nó hoạt động.

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

Tôi khuyên bạn nên sử dụng $.posthoặc $.getcú pháp của jQuery cho các trường hợp đơn giản:

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

Nếu bạn cần nắm bắt các trường hợp thất bại, chỉ cần làm điều này:

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

Ngoài ra, nếu bạn luôn gửi một chuỗi JSON, bạn có thể sử dụng $ .getJSON hoặc $ .post với một tham số nữa ở cuối.

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

Hãy thử sử dụng phương thức 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
});

Bạn không thể thấy các tham số trong URL bằng phương thức POST.

Biên tập:

Thông báo khấu hao: Các cuộc gọi lại jqXHR.success (), jqXHR.error () và jqXHR.complete () được loại bỏ kể từ jQuery 3.0. Bạn có thể sử dụng jqXHR.done (), jqXHR.fail () và jqXHR.always ().

Jquery.ajax không tự động mã hóa dữ liệu POST cho bạn theo cách mà dữ liệu GET thực hiện. Jquery hy vọng dữ liệu của bạn sẽ được định dạng trước để nối vào phần yêu cầu được gửi trực tiếp qua dây.

Một giải pháp là sử dụng hàm jQuery.param để xây dựng chuỗi truy vấn mà hầu hết các tập lệnh xử lý các yêu cầu POST mong đợi.

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

Trong trường hợp này, paramphương thức định dạng dữ liệu thành:

field1=hello&field2=hello2

Các Jquery.ajax tài liệu nói rằng có một lá cờ gọi processDatarằng điều khiển liệu mã hóa này được thực hiện tự động hay không. Tài liệu nói rằng nó mặc định true, nhưng đó không phải là hành vi tôi quan sát thấy khi POSTđược sử dụng.

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

Trong một yêu cầu POST , các tham số được gửi trong phần thân của yêu cầu, đó là lý do tại sao bạn không nhìn thấy chúng trong URL.

Nếu bạn muốn nhìn thấy chúng, hãy thay đổi

    type: 'POST',

đến

    type: 'GET',

Lưu ý rằng các trình duyệt có các công cụ phát triển cho phép bạn xem các yêu cầu hoàn chỉnh mà mã của bạn gặp sự cố. Trong Chrome, nó nằm trong bảng "Mạng".

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

type: 'POST', sẽ nối các tham số ** vào phần thân của yêu cầu ** không được nhìn thấy trong URL trong khi type: 'GET'nối các tham số vào URL hiển thị .

Hầu hết các trình duyệt web phổ biến có chứa các bảng mạng hiển thị yêu cầu hoàn chỉnh .

Trong bảng điều khiển mạng chọn XHR để xem các yêu cầu .

Điều này cũng có thể được thực hiện thông qua điều này.

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

Bạn có thể làm điều đó bằng cách sử dụng $ .ajax hoặc $ .post

Sử dụng $ .ajax:

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

Sử dụng $ .post:

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

Mã của bạn đã đúng trừ khi bạn không chuyển các khóa JSON dưới dạng chuỗi.

Nó nên có dấu ngoặc kép hoặc đơn xung quanh nó

{"field1": "xin chào", "trường2": "hello2"}

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

Để gửi tham số theo url trong POSTphương thức Bạn chỉ cần thêm nó vào url như thế này:

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