EDIT : 31/10/2017
Mã / cách tiếp cận tương tự cũng sẽ hoạt động cho Asp.Net Core 2.0 . Sự khác biệt chính là, trong lõi asp.net, cả bộ điều khiển api web và bộ điều khiển Mvc được hợp nhất với nhau thành mô hình bộ điều khiển duy nhất. Vì vậy, kiểu trả về của bạn có thể là IActionResult
một trong những cách thực hiện (Ví dụ OkObjectResult
:)
Sử dụng
contentType:"application/json"
Bạn cần sử dụng JSON.stringify
phương thức để chuyển đổi nó thành chuỗi JSON khi bạn gửi nó,
Và chất kết dính mô hình sẽ liên kết dữ liệu json với đối tượng lớp của bạn.
Các mã dưới đây sẽ hoạt động tốt (thử nghiệm)
$(function () {
var customer = {contact_name :"Scott",company_name:"HP"};
$.ajax({
type: "POST",
data :JSON.stringify(customer),
url: "api/Customer",
contentType: "application/json"
});
});
Kết quả
contentType
thuộc tính cho máy chủ biết rằng chúng tôi đang gửi dữ liệu ở định dạng JSON. Vì chúng tôi đã gửi một cấu trúc dữ liệu JSON, liên kết mô hình sẽ diễn ra đúng.
Nếu bạn kiểm tra các tiêu đề của yêu cầu ajax, bạn có thể thấy rằng Content-Type
giá trị được đặt là application/json
.
Nếu bạn không chỉ định rõ ràng ContentType, Nó sẽ sử dụng loại nội dung mặc định là application/x-www-form-urlencoded;
Chỉnh sửa vào tháng 11 năm 2015 để giải quyết các vấn đề khác có thể xảy ra trong các bình luận
Đăng một đối tượng phức tạp
Giả sử bạn có một lớp mô hình xem phức tạp như tham số phương thức hành động api web của bạn như thế này
public class CreateUserViewModel
{
public int Id {set;get;}
public string Name {set;get;}
public List<TagViewModel> Tags {set;get;}
}
public class TagViewModel
{
public int Id {set;get;}
public string Code {set;get;}
}
và điểm cuối api web của bạn giống như
public class ProductController : Controller
{
[HttpPost]
public CreateUserViewModel Save([FromBody] CreateUserViewModel m)
{
// I am just returning the posted model as it is.
// You may do other stuff and return different response.
// Ex : missileService.LaunchMissile(m);
return m;
}
}
Tại thời điểm viết bài này, ASP.NET MVC 6 là phiên bản ổn định mới nhất và trong MVC6, cả hai bộ điều khiển api Web và bộ điều khiển MVC đều được kế thừa từ Microsoft.AspNet.Mvc.Controller
lớp cơ sở.
Để gửi dữ liệu đến phương thức từ phía máy khách, đoạn mã dưới đây sẽ hoạt động tốt
//Build an object which matches the structure of our view model class
var model = {
Name: "Shyju",
Id: 123,
Tags: [{ Id: 12, Code: "C" }, { Id: 33, Code: "Swift" }]
};
$.ajax({
type: "POST",
data: JSON.stringify(model),
url: "../product/save",
contentType: "application/json"
}).done(function(res) {
console.log('res', res);
// Do something with the result :)
});
Mô hình ràng buộc hoạt động cho một số thuộc tính, nhưng không phải tất cả! Tại sao ?
Nếu bạn không trang trí tham số phương thức api web với [FromBody]
thuộc tính
[HttpPost]
public CreateUserViewModel Save(CreateUserViewModel m)
{
return m;
}
Và gửi mô hình (đối tượng javascript thô, không ở định dạng JSON) mà không chỉ định giá trị thuộc tính contentType
$.ajax({
type: "POST",
data: model,
url: "../product/save"
}).done(function (res) {
console.log('res', res);
});
Liên kết mô hình sẽ hoạt động cho các thuộc tính phẳng trên mô hình, không phải các thuộc tính trong đó loại phức tạp / loại khác. Trong trường hợp của chúng tôi Id
và Name
các thuộc tính sẽ được liên kết chính xác với tham số m
, nhưng thuộc Tags
tính sẽ là một danh sách trống.
Vấn đề tương tự sẽ xảy ra nếu bạn đang sử dụng phiên bản ngắn, $.post
sẽ sử dụng Kiểu nội dung mặc định khi gửi yêu cầu.
$.post("../product/save", model, function (res) {
//res contains the markup returned by the partial view
console.log('res', res);
});