[转]jquery getJSON 数据联动(采用序列化和反序列化获取数据) .
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
GetByJquery("#area", 0);
$("#area").change(function () {
GetByJquery("#subarea", $("#area").val());
});
$("#btnGet").click(function () {
alert($("#area").val() + "--" + $("#area option:selected").text());
});
});
function GetByJquery(ddlId, id, selId) {
$.getJSON("SelectAjax.ashx", { action: "area", id: id, rnd: Math.random() }, function (data) {
$(ddlId).empty();
$("<option value=\"-1\">不限</option>").appendTo($(ddlId));
$.each(data, function (i, item) {
$("<option></option>")
.val(item.AreaID)
.attr("selected", item.AreaID == selId)
.text(item.AreaName)
.appendTo($(ddlId));
});
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<select id="area" name="area">
<option value="-1">不限</option>
</select>
<select id="subarea" name="subarea">
<option value="-1">不限</option>
</select>
<input id="btnGet" name="btnGet" type="button" value="Get" />
</div>
</form>
</body>
</html>
SelectAjax.ashx文件:
/// <summary>
/// SelectAjax 的摘要说明
/// </summary>
public class SelectAjax : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string action = context.Request.QueryString["action"];
if (("area").Equals(action))
{
string id = context.Request.QueryString["id"];
if (!string.IsNullOrEmpty(id))
context.Response.Write(GetArea(id));
else context.Response.Write("");
}
}
private string GetArea(string id)
{
List<Area> areaList = new List<Area>();
if (id == "0")
{
areaList.Add(new Area
{
AreaID = "01",
AreaName = "罗湖区",
PID = "0"
});
areaList.Add(new Area
{
AreaID = "02",
AreaName = "福田区",
PID = "0"
});
}
if (id == "01")
{
areaList.Add(new Area
{
AreaID = "0101",
AreaName = "莲塘",
PID = "01"
});
areaList.Add(new Area
{
AreaID = "0102",
AreaName = "黄贝岭",
PID = "01"
});
}
if (id == "02")
{
areaList.Add(new Area
{
AreaID = "0201",
AreaName = "八卦岭",
PID = "02"
});
areaList.Add(new Area
{
AreaID = "0202",
AreaName = "华强",
PID = "02"
});
}
return Serialize(areaList);
}
/// <summary>
/// Json序列化
/// </summary>
/// <typeparam name="T">泛型</typeparam>
/// <param name="t">泛型</param>
/// <returns>序列化</returns>
private string Serialize(object obj)
{
JavaScriptSerializer js = new JavaScriptSerializer();
return js.Serialize(obj);
}
/// <summary>
/// Json反序列化
/// </summary>
/// <typeparam name="T">泛型</typeparam>
/// <param name="strJson">泛型</param>
/// <returns>反序列化</returns>
private T Deserialize<T>(string strJson)
{
JavaScriptSerializer js = new JavaScriptSerializer();
return js.Deserialize<T>(strJson);
}
public class Area
{
public string AreaID { get; set; }
public string AreaName { get; set; }
public string PID { get; set; }
}
public bool IsReusable
{
get
{
return false;
}
}
}
[转]jquery getJSON 数据联动(采用序列化和反序列化获取数据) .的更多相关文章
- Jackson序列化和反序列化Json数据完整示例
Jackson序列化和反序列化Json数据 Web技术发展的今天,Json和XML已经成为了web数据的事实标准,然而这种格式化的数据手工解析又非常麻烦,软件工程界永远不缺少工具,每当有需求的时候就会 ...
- go-redis 基于beego正确使用序列化存储数据和反序列化获取数据
安装go-redis // 安装命令 go get github.com/gomodule/redigo/redis // 导入使用 import( "github.com/gomodule ...
- Activity与Fragment数据传递之Fragment从Activity获取数据
整理Fragment与Activity之间的数据交换,大体上包括三种: 1.Fragment从Activity获取数据 2.Activity从Fragment获取数据 3.Fragment之间获取数据 ...
- 【Django+Element UI】使用一个接口文件,搞定分页获取数据,模糊查询后分页获取数据
1:序列化获取数据的接口设计 1:分页获取序列化数据 2:是个能传参数的接口 class Society(APIView): def post(self, request): keywords = s ...
- php 写入数据到MySQL以及从MySQL获取数据,页面出现乱码的解决方法
现象如标题. 解决思路: 1确定数据库charset是否是utf-8 a. charset不是utf-8 1, 更改数据库charset为utf-8 ALTER DATABASE db_name DE ...
- Android Fragment与Activity之间的数据交换(Fragment从Activity获取数据)
Fragment与Activity之间的数据交换,通常含有3: 一.Fragment从Activity获取数据(仅本文介绍了一个第一): 两.Activity从Fragment获取数据: 三.Frag ...
- pickle 数据对象的序列化和反序列化
python的pickle模块实现了基本的数据序列和反序列化.通过pickle模块的序列化操作我们能够将程序中运行的对象信息保存到文件中去,永久存储:通过pickle模块的反序列化操作,我们能够从文件 ...
- JS实现Ajax,Josn数据的序列化和反序列化---例: 省市区联动(包含get,post)
服务器端相应JOSN数据 用到序列化和反序列化----命名空间using System.Web.Script.Serialization; public void ProcessRequest(H ...
- WCF技术剖析之十二:数据契约(Data Contract)和数据契约序列化器(DataContractSerializer)
原文:WCF技术剖析之十二:数据契约(Data Contract)和数据契约序列化器(DataContractSerializer) [爱心链接:拯救一个25岁身患急性白血病的女孩[内有苏州电视台经济 ...
随机推荐
- JSWindow对象
Window 对象 Window 对象表示浏览器中打开的窗口. 如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外 ...
- array_multisort 的详细使用方法
1.如果第一个数组有相同的元素,那么后面对应位置的元素位置如何排序呢,请看下列代码$a1=array("Dog","Dog","Cat"); ...
- MFC双缓冲绘图(2015.09.24)
问题引入: 最近在尝试编写贪吃蛇游戏时遇到这么一个问题:当系统以较快频率向窗口发送WM_PAINT消息时,调用OnPaint()函数在窗口中绘制图形就会发生闪烁现象. 问题分析: 当我们把绘图过程放在 ...
- Quartus II 增量编译
在开发阶段,经常需要改代码,而且往往只改局部代码,但是编译的时候,通常会全部重新编译,这会很浪费时间,使得开发效率大大降低.那么有没有一种方法能够降低不必要的编译时间呢?通过查询Quartus II ...
- 当窗体获得焦点时禁用max快捷键
最近一段时间一直在MXS里用dotnet写界面...写的各种头晕眼花... 过程中遇到了 TextBox 控件输入时 与max快捷键冲突的问题. 解决办法是 用 MaxTextBox 控件替换,今天请 ...
- css实现自适应屏幕高度;
css实现自适应屏幕高度: <!DOCTYPE html><html lang="en"><head> <meta charset=&qu ...
- 如何搭建 node,react 开发环境
项目相关内容:Sublime + Node + React --注意:在 windows 操作系统中,如果把 node 安装在系统盘(一般是C盘),会导致 node 没有操作文件的权限的问题,如无法新 ...
- easycwmp的交叉编译
原创作品,转载请注明出处 copyright:weishusheng 2015.3.18 email:642613208@qq.com 平台: Linux version 2.6.32-279.e ...
- updatepanel 回发或回调参数无效
不同于网上的其它情况,这个是由于通过js修改了服务器控件Select的列表项数目,导致验证viewstate时出现的问题.最后改为通过服务器代码来给Select加选项,就不会报这个错误了. 服务器控件 ...
- JS正则截取两个字符串之间的字符串
match方法 var str = "iid0000ffr"; var substr = str.match(/id(\S*)ff/); console.log(substr) 返 ...