ajax调用后台Datatable

最新推荐文章于 2023-03-06 22:30:00 发布

xylike816

最新推荐文章于 2023-03-06 22:30:00 发布

阅读量116

点赞数

文章标签： json javascript ViewUI

本文链接：https://blog.csdn.net/xylike816/article/details/84011486

版权

之前遇到的问题，用AjaxPro方式没有实现，后来使用的Jquery .ajax方法调用后台的WebMethod返回的DataTable来实现的。有园友问关于将DataTable转换成JSON格式的疑问，我就简单的写个例子，描述实现过程。

--------------------------------------------------------------------------------

1，新建页面TestAjax2.aspx;

<body>
<form id="form1" runat="server">
<input id="btnJson" type="button" value="JSON" />
<div class="case_input1" id="article">
<ul>
</ul>

</div>
</form>
</body>

2.添加引用System.Web.Extension.

添加命名空间

using System.Web.Services;
using System.Collections;
using System.Web.Script.Serialization;

3. 在.cs文件中构建WebMethod方法,返回DataTable类型。

[WebMethod]
public static string getDataTable(string cid, string site)
{
DataSet ds = new UserCase().GetResult(cid, site, string.Empty);
string s = DTtoJSON(ds.Tables[0]);
return s.ToString();
}

4.添加方法，将DataTable转换为JSON。

public static string DTtoJSON(DataTable dt)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
ArrayList dic = new ArrayList();
foreach (DataRow row in dt.Rows)
{
Dictionary<string, object> drow = new Dictionary<string, object>();
foreach (DataColumn col in dt.Columns)
{
drow.Add(col.ColumnName, row[col.ColumnName]);
}
dic.Add(drow);
}
return jss.Serialize(dic);
}

5.aspx页面中用JQUERY进行AJAX调用。

<script type="text/javascript" src="jquery-1.6.2.js"></script>
<script language="javascript" type="text/javascript">
$(function () {
$("#btnJson").click(function () {
$.ajax({
type: "Post",
url: "TestAjax2.aspx/getRelatedArticle", //url页面/方法名
data: "{'cid':'C0503','site':'TP'}", //参数 {key/value}
contentType: "application/json;charset=utf-8",
dataType: "json",
success: function (data) {
data = jQuery.parseJSON(data.d);
$.each(data, function (i, item) {
$("#article ul").append('<li><a href="' + item.Href + '" target=_blank>' + item.Title+ '</a></li>')
})

},
error: function (error) {
alert(error);
}
});
})
})
</script>

xylike816

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
ajax调用后台Datatable

之前遇到的问题，用AjaxPro方式没有实现，后来使用的Jquery .ajax方法调用后台的WebMethod返回的DataTable来实现的。有园友问关于将DataTable转换成JSON格式的疑问，我就简单的写个例子，描述实现过程。---------------------------------------------------------------------------...
复制链接

扫一扫