使用ajax访问服务器返回多条数据,比如返回一个表中的所有数据,页面该如何处理呢?如何获取数据呢?一直不会用ajax返回json格式,今天研究了下,分享给大家~

首先需要引用服务,点击项目右键,添加引用

创建一般处理程序 CityHandler_json.ashx,添加引用using Newtonsoft.Json;

<%@ WebHandler Language="C#" Class="CityHandler_json" %>

using System;
using System.Web;
using Newtonsoft.Json;//添加引用
public class CityHandler_json : IHttpHandler {
    
    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";


        string sql = "select * from city ";
        System.Data.DataTable dt = SqlHelper.ExecuteTable(sql);
        if (dt != null && dt.Rows.Count > 0)
        {
            string Json = JsonConvert.SerializeObject(dt);//序列化为json格式
            context.Response.Write(Json);
           
        }
       
        context.Response.End();
    }
 
    public bool IsReusable {
        get {
            return false;
        }
    }

}
后台返回json代码

前台获取

 <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $.ajax({
                type: "post",
                url: "CityHandler_json.ashx",
                success: function (data) {
                    // alert(data);
                    var json = eval(data);//数组
                    $.each(json, function (index, item) {
                    //循环获取数据
                        var name = json[index].jc;
                        var id = json[index].cityID;
                        $("#cityInfo").html($("#cityInfo").html() + "<tr><td>" + name + "</td><td>" + id + "</td></tr>");
                    });
                }

            });

        });
    </script>
前台ajax方法

 

html页面

<body>
    
    <form id="form1" runat="server">
    <div id="text">
    <table border="1px;" id="cityInfo">
    </table>
    </div>
    </form>
</body>
页面html

 

posted on 2016-12-09 17:04  ~梅花~  阅读(1841)  评论(0编辑  收藏  举报