JQuery.Ajax()的data参数传递⽅式
最近,新学c# mvc,通过ajax post⽅式传递数据到controller。刚开始传递参数,controller中总是为null。现记录⼀下,可能不全,纯粹记个学习⽇记。
重点在于参数的⽅式,代码为例⼦
1、这⾥ dataType: "json",表⽰返回的格式是json
前端:
var saveAlbum = function () {
$.ajax(
{
url: "/Home/PostAlbum",
type: "POST",
dataType: "json",
data: { AlbumName: "shanghai", Entered: "5/9/2013" },
success: function (result) {
alert(result);
},
error: function (xhr, status, p3, p4) {
var err = "Error " + "" + status + "" + p3;
if (sponseText && sponseText[0] == "{")
err = JSON.sponseText).message;
alert(err);
}
});
}
controller:
public ActionResult PostAlbum(test test)
{
string str = String.Format("保存成功PostAlbum:{0} {1:d}", test.AlbumName, test.Entered);
return Json(str);//--------对应请求中dataType: "json",表⽰需要返回json类型
//return String.Format("保存成功PostAlbum:{0} {1:d}", test.AlbumName, test.Entered);//------如果是string,则会报错
}
2、ajax请求中还要⼀个重要的参数: contentType: "application/json",表⽰传⼊参数的格式
var saveAlbumJson = function () {
$.ajax(
{
url: "/Home/PostAlbum",
type: "POST",
contentType: "application/json",
dataType:"json",
data: JSON.stringify({ "AlbumName": "shanghai", "Entered": "5/9/2013" }),
success: function (result) {
alert(result);
},
error: function (xhr, status, p3, p4) {
var err = "Error " + "" + status + "" + p3;
if (sponseText && sponseText[0] == "{")
err = JSON.sponseText).message;
alert(err);
}
});
}
[HttpPost]
public ActionResult PostAlbum(test test)
{
string str = String.Format("保存成功PostAlbum:{0} {1:d}", test.AlbumName, test.Entered);//传⼊test实体jquery实现ajax
return Json(str);
//return String.Format("保存成功PostAlbum:{0} {1:d}", test.AlbumName, test.Entered);
}
public class test
{
public string AlbumName { get; set; }
public DateTime Entered { get; set; }
}
3、如果要传⼊list<;实体>,⽐如List<test>,需要把传⼊的data做转换
var saveAlbumJsonList = function () {
$.ajax(
{
url: "/Home/AlbumList",
type: "POST",
contentType: "application/json",
dataType: "json",
data: JSON.stringify({"input":[{ AlbumName: "shanghai", Entered: "5/9/2013" },{...},{....}]}),
success: function (result) {
alert(result);
},
error: function (xhr, status, p3, p4) {
var err = "Error " + "" + status + "" + p3;
if (sponseText && sponseText[0] == "{")
err = JSON.sponseText).message;
alert(err);
}
});
}
public ActionResult PostAlbumList(List<test> input)//input必须要与data中数组中的key匹配
{
if (input != null)
{
string str = String.Format("保存成功PostAlbum:{0} {1:d}", input[0].AlbumName, input[0].Entered);
return Json(str);
}else
{
return Json("参数获取错误!");
}
//return String.Format("保存成功PostAlbum:{0} {1:d}", test.AlbumName, test.Entered);
}
4、由上⾯三个例⼦,很容易想到,传⼊多个list<;实体>的⽅式
function postEmployees() {
$.ajax({
type: "POST",
url: "/Home/Employees",
contentType: "application/json",
dataType: "json",
async: false,
data: JSON.stringify({
"Employees": [{ "Id": "1", "lastName": "Gates" }, { "Id": "2", "lastName": "Bush" }, { "Id": "3", "lastName": "Carter" }],
"Employers": [{ "Id": "4", "lastName": "Gates" }, { "Id": "5", "lastName": "Bush" }, { "Id": "6", "lastName": "Carter" }] }),
success: function (jsonResult) {
alert(jsonResult);
}
});
}
[HttpPost]
public async Task<ActionResult> Employees(List<Employee> Employees, List<Employee> Employers)
{
return Json("Employees", JsonRequestBehavior.AllowGet);
}
public class Employee
{
public int Id { get; set; }
public string FirstName { get; set; }
public string LastName { get; set; }
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论