日期:2014-05-16  浏览次数:20367 次

Json数据异步绑定到界面的Table并且自动刷新

        做Winform习惯了,大家都习惯设置datasource这样的写法。

        如果想实现页面定时刷新的话,用.net给封装好的updatepanel和timer两个控件实现起来其实挺容易的。这样做加入了很多你不能控制的元素,举个例子说就是:用updatepanel后,你设置的样式很有可能就变了,然后你还需要去调这些。所以还是用一些自己控制性高的代码比较合适。

        今天就先从这个updatepanel加timer实现页面自动刷新这个例子来下手吧。

        首先来看一下我的一般处理程序,在这个里面,我自己实现的是从数据库中查出datatable,然后转换成json传输给客户端

/// <summary>
    /// getData 的摘要说明
    /// </summary>
    public class getData : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            //context.Response.Write("Hello World");

            //设置查询字符串
            string strSql = "select ckrID,chrCarNumber,cncName,bcrName from T_CarNumberCategory,T_CheckResult,t_BusinessCategory where ckrcheckresult is null and cncID=ckrcarnumbercategoryid and ckrBusinessCategory=bcrID";
            //设置连接字符串
            string strConn = "Data Source=(DESCRIPTION=(ADDRESS=(PROTOCOL=TCP)(HOST=192.168.24.173)(PORT=1521))(CONNECT_DATA=(SERVICE_NAME=ORCL)));User Id=admin;Password=123123";
            //定义并打开数据库连接
            OracleConnection conn = new OracleConnection(strConn);
            conn.Open();

            //定义命令行对象,
            OracleCommand cmd = new OracleCommand(strSql, conn);
            //定义一个适配器,用来填充Datatable            ;
            OracleDataAdapter adp = new OracleDataAdapter(cmd);
            //定义一个DataTable并用适配器对其进行填充
            DataTable dt = new DataTable();
            adp.Fill(dt);
            context.Response.Write(JsonConvert.SerializeObject(dt));

            //上面的是我从数据库中查询到的datatable,然后用一个Json操作类库将其转换为Json

            ////由于大家没有数据库环境,我把上面的字符串复制出来,供大家测试实验用
            ////由于复制出来是双引号,放这里会报个错误,所以我改成单引号了
            ////但是客户端在获取json的时候,是认双引号的,所以不得不再替换回来。。。心碎
            //var json = "[{'CKRID':'1359374764563','CHRCARNUMBER':'123123','CNCNAME':'大型汽车','BCRNAME':'核发检验合格标志'},{'CKRID':'1359371470153','CHRCARNUMBER':'asdfsadf','CNCNAME':'大型汽车','BCRNAME':'注册登记'},{'CKRID':'1359343210678','CHRCARNUMBER':'111222','CNCNAME':'大型汽车','BCRNAME':'注册登记'},{'CKRID':'1359354395618','CHRCARNUMBER':'123asd','CNCNAME':'大型汽车','BCRNAME':'注册登记'},{'CKRID':'1359355217314','CHRCARNUMBER':'123asdqwe','CNCNAME':'大型汽车','BCRNAME':'注册登记'},{'CKRID':'1359355356271','CHRCARNUMBER':'1111111','CNCNAME':'大型汽车','BCRNAME':'注册登记'},{'CKRID':'1359355490374','CHRCARNUMBER':'123123123','CNCNAME':'大型汽车','BCRNAME':'注册登记'},{'CKRID':'1358074597852','CHRCARNUMBER':'323232','CNCNAME':'使馆汽车','BCRNAME':'核发检验合格标志'}]";
            //context.Response.Write(json.Replace('\'','\"'));
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

        上面的服务器端程序中的注释很详细,有不懂的可以留言说明。类库的用的是Newtonsoft.Json.dll。大家点击即可从我的网盘里下载——不要任何费用哦~亲

        下面是客户端代码:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>测试</title>
    <script src="jquery-1.7.1.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <table id="data">
        <tr id="tem">
            <td id="ID">