1.用Jquery.getjson读取数据库数据，然后动态创建一个table，把json格式的数据动态增加到table中
第一步，读取数据库数据，还是用最基本的方法读取数据库，新建一个ahpx页，读取数据库，代码如下：
1 /// <summary> 2 /// Handler2 的摘要说明 3 /// </summary> 4 public class Handler2 : IHttpHandler 5 { 6 string connstr = @"Data Source=JYZ\SQL2008;Initial Catalog=123;User ID=sa;Password=123456"; //数据库连接字符串 7 8 public void ProcessRequest(HttpContext context) 9 { 10 context.Response.ContentType = "text/plain"; 11 12 tableNameModel tablenamemodel; //实体model 13 14 List<tableNameModel> list = new List<tableNameModel>(); //创建一个List<>集合 15 using (SqlConnection conn = new SqlConnection(connstr)) //连接数据库 16 { 17 string sql="select * from tableName"; //查询语句 18 using (SqlCommand cmd = new SqlCommand(sql, conn)) //执行查询方法 19 { 20 SqlDataAdapter sb = new SqlDataAdapter(cmd); //查询返回一个数据集 21 DataTable tb=new DataTable(); 22 sb.Fill(tb); //把查询完的数据保存在table中 23 24 for (int i = 0; i < tb.Rows.Count; i++) //把数据转换成对象 25 { 26 tablenamemodel = new tableNameModel(); 27 DataRow tr = tb.Rows[i]; 28 tablenamemodel.Id = Convert .ToInt32(tr["id"]); 29 tablenamemodel.Name =tr["name"].ToString(); 30 tablenamemodel.Gongzr = Convert.ToInt32(tr["gongzr"]); 31 list.Add(tablenamemodel); //把model增加到List<>中 32 } 33 34 35 JavaScriptSerializer ss = new JavaScriptSerializer(); //new一个转换list成json的对象 36 string dd = ss.Serialize(list);//把集合转换成json; 37 context.Response.Write(dd); //返回给页面 38 39 ; 40 41 } 42 } 43 44 } 45 46 public bool IsReusable 47 { 48 get 49 { 50 return false; 51 } 52 } 53 }
现在，我们就把数据库中的数据读了出来而且还把数据转换成了json格式的数据，返回了给页面，那现在，我们就要在页面去处理 json数据了，
代码如下：
1 <head runat="server"> 2 <title></title> 3 <script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script> 4 5 <script type="text/javascript"> 6 $(function () { 7 8 $("#button1").click(function () { 9 //用getjson读取Handler2.ashx的数据 10 $.getJSON("Handler2.ashx", function (json) { 11 12 // 动态的创建一个table，加上一行 13 var strhtml = $("<table border='1' width='30%' cellpadding='0' ><tr><td>序号</td><td>姓名</td><td>工资</td></tr></table>"); 14 //循环返回传过来的json数据，Infoindex就是key,Info就是value 15 $.each(json, function (InfoIndex, Info) { 16 17 tr = $("<tr></tr>");//动态的创建一行 18 var td = $("<td>\"" + Info["Id"] + "</td>");//json的值增加到td中 19 tr.append(td); 20 var td = $("<td>\"" + Info["Name"] + "</td>"); //json的值增加到td中 21 tr.append(td); 22 var td = $("<td>\"" + Info["Gongzr"] + "</td>"); //json的值增加到td中 23 tr.append(td); 24 strhtml.append(tr);//把这一行增加到table中 25 }) 26 27 $("#hide").html(strhtml);//最后把table增加到div中，这样一个表单就好了 28 29 30 31 32 }) 33 }) 34 }) 35 </script> 36 <style type="text/css"> 37 38 </style> 39 </head> 40 <body> 41 <form id="form1" runat="server"> 42 <div> 43 <input id="button1" type="button" name="name" value="提交" /> 44 <div id="hide"></div> 45 </div> 46 </form> 47 </body> 48 </html>
这样点击提交，在浏览器就可以看到
这样一个用$.getjson动态加载表单就做好了
这里基础最重要的就是去拼table了，然后就是如何把json格式的数据增加进表里面去，asp.net给我们提供了一个很好很强大的类，这类直接就可以的一个List<>转换成一个json格式的字符串，我们就可以直接返回一个json格式的字符串，然后在前台处理了，不得不说微软的强大，和jquery的方便！