jquery ajax实现省市县3级联动
2013-03-07 11:33
232 查看
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function () { var ddlProvince = $("#ddlProvince"); var ddlCity = $("#ddlCity"); var ddlCounty = $("#ddlCounty"); LoadData(0, "", ddlProvince); ddlCity.html('<option selected="selected" value="0">---请选择----</option>'); ddlCounty.html('<option selected="selected" value="0">---请选择----</option>'); ddlProvince.change(function () { LoadData(1, ddlProvince.val(), ddlCity); ddlCounty.html('<option selected="selected" value="0">---请选择----</option>'); }); ddlCity.change(function () { LoadData(2, ddlCity.val(), ddlCounty); }); }); function LoadData(level, code, ddl) { ddl.html('<option selected="selected" value="0">---请选择----</option>'); $.getJSON('area.ashx', { level: level, code: code }, function (data) { for (var i = 0; i < data.length; i++) { ddl.append($("<option></option>").val(data[i].AreaCode).html(data[i].AreaName)); } }); } </script> </head> <body> <form id="form1" runat="server"> <div> <asp:DropDownList ID="ddlCountry" runat="Server"> <asp:ListItem Selected="True">中国</asp:ListItem> </asp:DropDownList> <asp:DropDownList ID="ddlProvince" runat="server" > </asp:DropDownList> <asp:DropDownList ID="ddlCity" runat="server"> </asp:DropDownList> <asp:DropDownList ID="ddlCounty" runat="server"> </asp:DropDownList> </div> </form> </body> </html>
area.ashxusing System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Text;using Model;using Service;using DAO;namespace WebApplication1{ /// <summary> /// area 的摘要说明 /// </summary> public class area : IHttpHandler
{ public Service.AreaService service = new Service.AreaService(); public IList<Area> AreaList; IDictionary<string, object> conditions = new Dictionary<string, object>(); public void ProcessRequest(HttpContext context) { string code = context.Request["code"].ToString();
int level = Convert.ToInt32(context.Request["level"]); StringBuilder sb = new StringBuilder(string.Empty); conditions.Add("AreaCode", code); switch (level) { case 0: AreaList = service.GetProvinceService(); break; case 1: AreaList = service.GetCityByProvinceService(conditions);
break; case 2: AreaList = service.GetCountyByCityNameService(conditions); break; default: break; } string result = Newtonsoft.Json.JsonConvert.SerializeObject(AreaList); context.Response.ContentType = "text/plain"; context.Response.Write(result); } public
bool IsReusable { get { return false; } } }}
相关文章推荐
- jquery ajax实现省市二级联动
- jquery ajax实现省市二级联动
- php jquery ajax json 全国省市区三级联动下拉列表 简单实现
- php jquery ajax json 全国省市区三级联动下拉列表 简单实现
- jQuery ajax实现省市县三级联动
- DropDownList:用Anthem写的实现省市县3级联动
- php jquery ajax json 全国省市区三级联动下拉列表 简单实现
- 用 jsp 写的 ajax 技术实现省市县等 n 级联动
- VUE2 前端实现 静态二级省市联动选择select的示例
- 用JS实现省市二级联动
- jquery读取xml文件实现省市县三级联动的方法
- 基于JS实现省市联动效果代码分享
- AJAX 实现省市县地名三级联动
- Android省市区3级联动的地址列表的实现
- JS实现省市联动
- Java框架SSH结合Easyui控件实现省市县三级联动示例解析
- jQuery+php+mysql,轻松实现ajax无刷新省市二级联动
- 用简易Ajax框架实现"省市二级联动下拉菜单"【原创】
- 省市区三级联动select下拉框,下拉框数据回显 Demo js脚本实现带脚本与案例,整理好了的下载既可用