我先写一个get Ajax请求js,这个请求主要是获取数据然后进行遍历插入到表格中展示
$.ajax({
url: "/Detail/GetTemplateContent",//请求的url
type: "get",
dataType: "json",
success:
function (data) {
str += "<div id='ContentDiv' class='col-sm-8'><table id='table' class='table table-hover'><thead><tr><th scope='col'>操作</th><th scope='col'>模板名称</th><th scope='col'>模板内容</th></tr></thead><tbody>";
if (data.Status == 1) {
//遍历数据
$.each(data.TemplateList, function (index, element) {
str += "<tr><td><input type='CheckBox'/></td><td>" + element.Name + "</td><td title='" + element.Content + "'>" + element.Content + "</td></tr>";
})
}
else {
str += "<div style='width:70%;height:40%;overflow-y:scroll'>没有数据</div>";
}
str += "</tbody></table></div><div style='background-color:#dddddd;margin-left:15%' class='col-sm-8'><button id='Cancel' onclick='Close()' style='margin:3px auto 5px 60px;' class='btn btn-default col-sm-3'>关闭</button><button id='OK' onclick='Ok()' style='margin:3px auto 5px 120px;' class='btn btn-success col-sm-3'>确定</button></div>";
//遍历完成之后
$('#ShowDialog1').append(str);
$("#ShowDialog1").stop(true, true).animate({ bottom: "200px" }, 0.5);
}
})
后台代码如下,因为是封装好的所以比较简单不过返回的Json数据一样
[HttpGet]
public string GetTemplateContent()
{
//取模板数据
string strUi = string.Empty;
string strHis = string.Empty;
int nRet = InternalService.CallServices((int)PAFunctionId.GetTemplateInfo, "", "", out strUi, out strHis);
return strHis;
}
返回的数据格式Json 数据
{
"Status":1,
"TemplateList":[{"Name":"123","Content":"测试"},{"Name":"321","Content":"测试2"},{"Name":"321","Content":"测试2"},{"Name":"321","Content":"测试2"},{"Name":"321","Content":"测试2"},{"Name":"321","Content":"测试2"},{"Name":"321","Content":"测试2"},{"Name":"321","Content":"测试2"}],
"Msg":null
}
这个时候的success:function(data)中的data可以直接data.Status,data.TemplateList,data.Msg能够取到相应的值,接下来看Post请求,如下:
$.ajax({
type: "post",
url: "/Detail/Save",
data: { strJson: json },
success: function (data) {
var rdata = JSON.parse(data);
if (rdata.StatusCode == 200) {
alert(rdata.mse);
window.close();
}
else {
alert(rdata.mse);
}
}
})
后台代码如下:
public string Save(string strJson)
{
string json = CPWContext.GetResultModel(new FunModel { FunName = "Reason_Save", strJson = strJson });
return json;
}
返回的Josn数据如下:
{
"StatusCode":200,
"mse":"提交成功"
}
或者
{
"StatusCode":400,
"mse":"提交失败"
}
post请求返回的数据success:function(data)中的data不能直接data.StatusCode获取数据,会报错underfind,必须通过var rdata=JSON.parse(data) 之后rdata.StatusCode才能取到对应的数据。这点我目前好不明白,有高手看到能指点一下么?
经过研究才发现,因为我在get请求中设定了返回的格式 datatype:json 所以后台返回的json格式数据直接就格式化为json所以可以通过 data.StatusCode获取到数据。
对于Datatype的用法解释:
dataType
预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如XML MIME类型就被识别为XML。
在1.4中,JSON就会生成一个JavaScript对象,而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。
可用值:
"xml": 返回 XML 文档,可用 jQuery 处理。
"html": 返回纯文本 HTML 信息;包含的script标签会在插入dom时执行。
"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。'''注意:'''在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
"json": 返回 JSON 数据 。
"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。
"text": 返回纯文本字符串
希望对一些朋友有点帮助