首页 > 代码库 > 使用jQuery的getJSON方式提交数据(后端处理类是一般处理程序) 一个级联的操作

使用jQuery的getJSON方式提交数据(后端处理类是一般处理程序) 一个级联的操作

前端:

 1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5     <title></title> 6     <script src=http://www.mamicode.com/"script/jquery-1.7.1.js"></script> 7     <script type="text/javascript"> 8         $(function () { 9             $.getJSON(linkage.ashx, { pid: 0 }, function (msg) {10                 $.each(msg.items, function (index, item) {11                     $(#t1).append(<option value=http://www.mamicode.com/ + item.TypeId + > + item.TypeTitle + </option>);12                 });13             });14             $(#t1).change(function () {15                 $.getJSON(linkage.ashx, { pid: $(#t1).val() }, function(msg) {16                     $.each(msg.items, function(index, item) {17                         $(#t2).append(<option value=http://www.mamicode.com/ + item.TypeId + > + item.TypeTitle + </option>);18                     });19                 });20             });21         });22     </script>23 </head>24 <body>25     <select id="t1"></select>26     <select id="t2"></select>27 </body>28 </html>

后端代码:

 1 using System; 2 using System.Collections.Generic; 3 using System.Data; 4 using System.Data.SqlClient; 5 using System.Linq; 6 using System.Web; 7 using System.Web.Script.Serialization; 8  9 namespace _01二级联动10 {11     /// <summary>12     /// linkage 的摘要说明13     /// </summary>14     public class linkage : IHttpHandler15     {16 17         public void ProcessRequest(HttpContext context)18         {19             context.Response.ContentType = "text/plain";20             string connStr = "server=.;database=web1;uid=sa;pwd=sa;";21             string pid = context.Request["pid"];22             string sql = "select * from typeinfo where typeparentid = " + pid + "";23             SqlDataAdapter sda = new SqlDataAdapter(sql, connStr);24             DataTable dt = new DataTable();25             sda.Fill(dt);26             List<TypeInfo> list = new List<TypeInfo>();27             foreach (DataRow row in dt.Rows)28             {29                 list.Add30                     (31                         new TypeInfo()32                         {33                             TypeId = Convert.ToInt32(row["TypeId"]),34                             TypeTitle = row["TypeTitle"].ToString(),35                             TypeParentId = Convert.ToInt32(row["TypeParentId"])36                         }37                     );38             }39             //var item = new40             //{41             //    items = list42             //};43             //等价于   new{ items = list}44             JavaScriptSerializer jsJson = new JavaScriptSerializer();45             string res = jsJson.Serialize46                 (47                     new48                     {49                         items = list50                     }51                 );52             context.Response.Write(res);53         }54 55         public bool IsReusable56         {57             get58             {59                 return false;60             }61         }62     }63 }

一个级联的操作

使用jQuery的getJSON方式提交数据(后端处理类是一般处理程序) 一个级联的操作