Chuyển nhiều tham số đến lệnh gọi jQuery ajax


99

Tôi có mã jquery sau để gọi một webmethod trong một trang aspx

$.ajax({
    type: "POST",
    url: "popup.aspx/GetJewellerAssets",
    contentType: "application/json; charset=utf-8",
    data: '{"jewellerId":' + filter + '}',
    dataType: "json",
    success: AjaxSucceeded,
    error: AjaxFailed
});

và đây là chữ ký phương pháp web

[WebMethod]
public static string GetJewellerAssets(int jewellerId)
{

Điều này hoạt động tốt.

Nhưng bây giờ tôi cần nhận hai tham số được truyền cho phương thức web

phương pháp web mới trông như thế này

[WebMethod]
public static string GetJewellerAssets(int jewellerId, string locale)
{
}

Làm cách nào để thay đổi mã máy khách để gọi thành công chữ ký phương thức mới này?

BIÊN TẬP:

2 cú pháp sau đã hoạt động

data: '{ "jewellerId":' + filter + ', "locale":"en" }',

data: JSON.stringify({ jewellerId: filter, locale: locale }),

trong đó bộ lọc và ngôn ngữ là các biến cục bộ


9
data: JSON.stringify({ jewellerId: filter, locale: locale })là cách tốt nhất mà tôi từng thấy, Cảm ơn @ChrisCa
Frank Myat Thu

Nếu bạn là một người có tâm hồn buồn bã như tôi, bạn có thể đã mắc kẹt với điều này hàng giờ. Khi sử dụng JSON.stringifyvới một đối tượng theo nghĩa đen, bạn PHẢI bao gồm tên tham số bằng dấu hai chấm, tất cả đều được bọc bên trong {}dấu ngoặc nhọn. Sử dụng JSON.stringify(objectLiteral)không hoạt động.
Kaleb Anderson

Phương thức ký như thế [WebMethod] [ScriptMethod(UseHttpGet = true)] public static string TestIBAN(string ccc)nào?
Kiquenet

Câu trả lời:


141

Không sử dụng nối chuỗi để chuyển các tham số, chỉ cần sử dụng một hàm băm dữ liệu:

$.ajax({
    type: 'POST',
    url: 'popup.aspx/GetJewellerAssets',
    contentType: 'application/json; charset=utf-8',
    data: { jewellerId: filter, locale: 'en-US' },
    dataType: 'json',
    success: AjaxSucceeded,
    error: AjaxFailed
});

CẬP NHẬT:

Như được đề xuất bởi @Alex trong phần nhận xét, một ASP.NET PageMethod mong đợi các tham số được mã hóa JSON trong yêu cầu, vì vậy JSON.stringifynên được áp dụng trên băm dữ liệu:

$.ajax({
    type: 'POST',
    url: 'popup.aspx/GetJewellerAssets',
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify({ jewellerId: filter, locale: 'en-US' }),
    dataType: 'json',
    success: AjaxSucceeded,
    error: AjaxFailed
});

12
Cũng nên xem xét sử dụng JSON.stringify( myObject )để tạo chuỗi JSON từ một đối tượng javascript, trong trường hợp bạn muốn nhóm các tham số của mình thành một lớp sau này.
Alex Bagnolini

1
cảm ơn vì đã trả lời - tuy nhiên, tôi nhận được trạng thái http 500 khi tôi thử nó như vậy. Bất kỳ ý tưởng? hoặc thậm chí làm thế nào để gỡ lỗi nó? Breakpoint trong phương thức web không bao giờ bị đánh
ChrisCa

1
mã mới như sau $ .ajax ({type: 'POST', url: 'popup.aspx / GetJewellerAssets', contentType: 'application / json; charset = utf-8', data: {jewellerId: filter, locale: 'en -US '}, dataType: "json", thành công: AjaxSucceeded, lỗi: AjaxFailed});
ChrisCa

1
Để gỡ lỗi, trước tiên hãy xem FireBug phản hồi chính xác của máy chủ là gì, sau đó đặt điểm ngắt trong phương thức dịch vụ web và xem nó có đạt được không.
Darin Dimitrov

1
Điểm ngắt trong phương pháp web không bao giờ bị tấn công Firebug hiển thị: "Thông báo": "Nguyên thủy JSON không hợp lệ: jewellerId.", "StackTrace": "tại System.Web.Script.Serialization Vì vậy, tôi đoán cú pháp của json không chính xác
ChrisCa

18
data: '{"jewellerId":"' + filter + '","locale":"' + locale + '"}',

1
điều này đã hoạt động: '{"jewellerId":' + filter + ', "locale": "en"}', (rõ ràng là tôi sẽ không mã hóa miền địa phương thành en, nhưng đây là cú pháp đã hoạt động.
ChrisCa

Điều này đã làm việc cho tôi với MVC 3. Tôi không thể làm theo cách của Darin - có lẽ đó là một thứ MVC 3.
fiat

7

chỉ cần thêm bao nhiêu thuộc tính bạn cần vào đối tượng dữ liệu.

 $.ajax({
                    type: "POST",
                    url: "popup.aspx/GetJewellerAssets",
                    contentType: "application/json; charset=utf-8",
                    data: {jewellerId: filter , foo: "bar", other: "otherValue"},
                    dataType: "json",
                    success: AjaxSucceeded,
                    error: AjaxFailed
                });

1
Chữ ký webmethod sẽ trông như thế nào trong trường hợp này để đọc ra các thuộc tính ở dataphía máy chủ?
Flo

5

KHÔNG sử dụng phương pháp dưới đây để gửi dữ liệu bằng lệnh gọi ajax

data: '{"jewellerId":"' + filter + '","locale":"' + locale + '"}'

Nếu do nhầm lẫn người dùng nhập ký tự đặc biệt như dấu nháy đơn hoặc dấu nháy kép, lệnh gọi ajax không thành công do sai chuỗi.

Sử dụng phương pháp dưới đây để gọi dịch vụ Web mà không gặp bất kỳ sự cố nào

var parameter = {
       jewellerId: filter,
       locale : locale 
};


data: JSON.stringify(parameter)

Trong tham số trên là tên của đối tượng javascript và xâu chuỗi nó khi chuyển nó vào thuộc tính dữ liệu của lệnh gọi ajax.


3

Có ai khác nhận thấy rằng chuỗi / đối tượng json không hợp lệ trong tất cả các câu trả lời ngoại trừ câu trả lời của David Hedlund không? :)

Các đối tượng JSON phải được định dạng theo cách sau: {"key": ("value" | 0 | false)}. Ngoài ra, viết nó ra dưới dạng một chuỗi đòi hỏi ít hơn nhiều so với việc xâu chuỗi đối tượng ...


3
$.ajax({
    type: 'POST',
    url: 'popup.aspx/GetJewellerAssets',      
    data: "jewellerId=" + filter+ "&locale=" +  locale,  
    success: AjaxSucceeded,
    error: AjaxFailed
});

Làm việc quá bằng cách sử dụng loại: GET ?
Kiquenet

hoặc bạn có thể sử dụng một mảng để truyền dữ liệu trong jason.stringyfy (mảng).
Shekhar Patel

1

Chỉ cần thêm vào [Dòng này hoạt động hoàn hảo trong Asp.net & tìm các Trường điều khiển web trong jason Ví dụ: <% Fieldname%>]

 data: "{LocationName:'" + document.getElementById('<%=txtLocationName.ClientID%>').value + "',AreaID:'" + document.getElementById('<%=DropDownArea.ClientID%>').value + "'}",

1
    var valueOfTextBox=$("#result").val();
    var valueOfSelectedCheckbox=$("#radio:checked").val();

    $.ajax({
    url: 'result.php',
    type: 'POST',
    data: { forValue: valueOfTextBox, check : valueOfSelectedCheckbox } ,
    beforeSend: function() {

          $("#loader").show();
       },
    success: function (response) {
       $("#loader").hide();
       $("#answer").text(response);
    },
    error: function () {
        //$("#loader").show();
        alert("error occured");
    }
    }); 

0

Tất cả về dữ liệu mà bạn vượt qua; phải định dạng đúng chuỗi. Nếu bạn đang chuyển dữ liệu trống thì dữ liệu: {} sẽ hoạt động. Tuy nhiên với nhiều tham số, nó phải được định dạng đúng, ví dụ:

var dataParam = '{' + '"data1Variable": "' + data1Value+ '", "data2Variable": "' + data2Value+ '"' +  '}';

....

data: dataParam

...

Cách tốt nhất để hiểu là có trình xử lý lỗi với tham số thông báo thích hợp, để biết các lỗi chi tiết.


0

Tôi đã chuyển thành công nhiều tham số bằng json

data: "{'RecomendeeName':'" + document.getElementById('txtSearch').value + "'," + "'tempdata':'" +"myvalue" + "'}",

không bao giờ chuyển dữ liệu người dùng cho một tham số mà không 'làm sạch' trước đó.
fcm
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.