Ajax异步调用详解实例解析

时间：2011-11-25 编辑：简简单单来源：一聚教程网

Ajax更着重在前端页面异步显示后台数据库里的字段，主体思想与上篇相似，重点是DAL层得到存储过程中返回的表集合DataSet,在一般存储过程中拼接字符串时，将表一行的数据分别做成键值对的形式

1.前端页面包含脚本（ajax）和基本的HTML标记以方便大家对应查找和理解

代码如下

复制代码

function InitData() {                                            //页面加载时调用此事件
             $.ajax({
                  type: "POST",
                  url: "/AjaxRequest/GetUserList.ashx",             //链接到相应的一般处理程序
                  data: { state: 1 },
                  success: function (data) {
                      if (data != null) {
                          var html = "

ID用户名创建时间执行操作

";                         //拼接字符串标签并放入变量html里，注意：拼接时“需要转义-如第一个span里的类
                          $.each(data, function (i, n) {                         //jquery循环输出列表里的每行数据，如果用javascript可以考虑用for循环
                                 html += "

" + (1 + i) + "" + n.USER_Name + "" + n.USER_Time + "[编辑][删除]

";
//依然是拼接要显示的标记，注意：变量html+=，另外如果是内容部分或者每行不一样的部分要用变量
//变量用data[i].键（就可以得到url指向的文件中json对象里该键对应的值）的形式，键是指一般处理程序文件中拼接JSON对象时的键值对，
//n在此处表示data[i]（是jquery离得each用法，如果是再javascript中可以用data[i].USER_ID）
                         });
                         $("#list_ul").append(html);               //获取要显示列表的ul，用append添加拼接好的标签字符串

                     }
                   else {
                       alert("Error!");
                    }
                 }
             })
         }

2.一般处理程序GetUserList.ashx，将从底层得到的DataSet里的数据转换成json对象返回给调用页面

代码如下

复制代码

public void ProcessRequest(HttpContext context)
         {
             context.Response.ContentType = "text/plain";
             string result =" [";
             string name=string.Empty;
             int? state = null;
             DateTime time;
             Int Id=0;
             if (!string.IsNullOrEmpty(context.Request["state"]))
                 state = Convert.ToInt32(context.Request["state"]);
             DataSet _set=new BLL.Province().GetProvinceList(state);
             foreach(DataRow dr in _set.Tables[0].Rows)
             {
               name=Convert.ToString(dr["USER_Name"]);
               Id=Convert.ToInt32(dr["USER_ID"]);
               time=Convert.ToDateTime(dr["USER_Time"]);
result+="{"USER_Name":""+name+"","USER_ID":""+Id+"","USER_Time":""+time+""},";
             }
             resul= result.Trim(",")+"] ";
             context.Response.Write(result);
         }

上一个： javascript cookie操作详解
下一个： Linux 登录和退出系统命令

推荐专题

最新下载

热门教程

Ajax异步调用详解实例解析

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程