- 简介
- 与传统区别Web请求区别
- 实现步骤
- 实例介绍
省市下拉列表级联菜单实现
- 界面
服务器端代码,并把数据转换成JSON格式- $(function (){
- //注册下拉列表框的改变事件
- $('#dropProvince').change(function (){
- //1.获取浏览器(下拉列表选择项)的ID值
- var proID = $(this).val();
- //服务器地址
- var url = "../Hander/test.ashx?proID=" + proID
- //2.通过JQuery的get()方法,向服务器提交数据
- $.get(url,function (data) {
- //3、4.处理服务器返回的数据并加载到界面上
- var dtJSON = eval(data);
- //清空上次改变添加的数据,避免累加
- $('#dropCity').html("");
- $("<option value=''>" + "请选择城市" + "</option>").appendTo($('#dropCity'));
- for (var i = 0; i < dtJSON.length; i++)
- {
- //创建新的选择项,并添加到下拉列表中
- $("<option value=" + dtJSON[i].cityName + ">" + dtJSON[i].cityName + "</option>").appendTo($('#dropCity'));
- }
- })
- });
- });
- public void ProcessRequest(HttpContext context)
- {
- context.Response.ContentType = "text/plain";
- //接受客户端请求的参数
- string proID = context.Request.QueryString["proID"];
- //实例化操作类
- VoteManager voteManager = new VoteManager();
- DataTable dt = new DataTable();
- //执行方法
- dt = voteManager.SelectCityByProvince(proID);
- //将数据转换为JSON格式
- string strJson = DataTableToJson("Json",dt);
- context.Response.Write(strJson);
- context.Response.End();
- }
- //将DataTable数据转换成JSON数据格式
- public string DataTableToJson(string jsonName,DataTable dt)
- {
- StringBuilder Json = new StringBuilder();
- Json.Append("[");
- if (dt.Rows.Count > 0)
- {
- for (int i = 0; i < dt.Rows.Count; i++)
- {
- Json.Append("{");
- for (int j = 0; j < dt.Columns.Count; j++)
- {
- Json.Append(dt.Columns[j].ColumnName.ToString() + ":\"" + dt.Rows[i][j].ToString() + "\"");
- if (j < dt.Columns.Count - 1)
- {
- Json.Append(",");
- }
- }
- Json.Append("}");
- if (i < dt.Rows.Count - 1)
- {
- Json.Append(",");
- }
- }
- }
- Json.Append("]");
- return Json.ToString();
- }