asp.net+JSON+AJAX(基于prototype1.4)做无刷新的2级DropDownList

最新推荐文章于 2024-05-06 11:21:34 发布
最新推荐文章于 2024-05-06 11:21:34 发布
阅读量73 收藏 1
点赞数
文章标签： json c# javascript ViewUI
原文链接：http://www.cnblogs.com/xiongeee/archive/2008/10/18/1314243.html
版权

JSON的数据格式:{"xx":"xx1","yy":[{"yy1":"yyy1"},{"yy2":"yyy2"}]}

后台部分:(合成JSON数据格式)

//这是获取根目录
public string getRootTree()
{

using(SqlDataReader dr=SqlHelper.ExecuteReader(conn,System.Data.CommandType.Text,"select * from MMenu where MParentID=0"))
{
sb.Append("{""region"":[");
while(dr.Read())
{
sb.Append("{""");
sb.Append("MID");
sb.Append(""":""");
sb.Append(dr["MID"].ToString());
sb.Append(""",""");
sb.Append("MName");
sb.Append(""":""");
sb.Append(dr["MName"].ToString());
sb.Append(""",""");
sb.Append("MParentID");
sb.Append(""":""");
sb.Append(dr["MParentID"].ToString());
sb.Append("""},");
}
sb.Append("]");
return sb.ToString().Substring(0,sb.ToString().Length-2)+"]}";
}
} 

//根据ID获取下级的数据

public string getSubTree(int MID)
{
using(SqlDataReader dr=SqlHelper.ExecuteReader(conn,System.Data.CommandType.Text,"select * from MMenu where MParentID="+MID))
{
sb.Append("{""region"":[");
while(dr.Read())
{
sb.Append("{""");
sb.Append("MID");
sb.Append(""":""");
sb.Append(dr["MID"].ToString());
sb.Append(""",""");
sb.Append("MName");
sb.Append(""":""");
sb.Append(dr["MName"].ToString());
sb.Append(""",""");
sb.Append("MParentID");
sb.Append(""":""");
sb.Append(dr["MParentID"].ToString());
sb.Append("""},");
}
sb.Append("]");
return sb.ToString().Substring(0,sb.ToString().Length-2)+"]}";
}
}

前台部分:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<html>
<head>
<title>select</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">
<script src=js/prototype-1.4.0.js></script>
<script>
function getJSON()
{
var myoptions={
parameters:"",
method:"get",
onSuccess:function(res){
var myData=eval("("+res.responseText+")");
myData.region.each(function(xx){
$("root").options.add(new Option(xx.MName,xx.MID));
}
);

}
}
new Ajax.Request("jsonSelect.aspx?action=root&s"+Math.random(),myoptions);
}

function getSub(id)
{
var myoptions={
parameters:"subID="+id,
method:"get",
onSuccess:function(res){
var myData=eval("("+res.responseText+")");
$("sub").options.length=1;
myData.region.each(function(xx){

$("sub").options.add(new Option(xx.MName,xx.MID));
}
);
}
}
new Ajax.Request("jsonSelect.aspx?action=sub&s"+Math.random(),myoptions);
}
</script>
</head>
<body οnlοad=getJSON()>

<form id="Form1" method="post" runat="server">
<select name="a" id="root" onChange="getSub(this.value)">
<option value="" selected>-----请选择类别-----</option>

</select>
<select name="a" id="sub" onChange="getSub(this.value)">
<option value="" selected>-----请选择类别-----</option>

</select>
</form>

</body>
</html>

转载于:https://www.cnblogs.com/xiongeee/archive/2008/10/18/1314243.html

akpaul6677
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
DropDownList省市区Ajax无刷新三级联动 带最新省市区数据库脚本.zip
02-21
DropDownList省市区Ajax无刷新三级联动 带最新省市区数据库脚本 可以直接拿来用 学习
asp.net+JSON+Ajax(基于Prototype框架1.4)做无刷新的2级DropDownList代码实例
weixin_30345055的博客
08-31 38
原文来自：http://www.ajaxsamples.cn/html/21096.html JSON的数据格式:{"xx":"xx1","yy":[{"yy1":"yyy1"},{"yy2":"yyy2"}]} 后台部分:(合成JSON数据格式) //这是获取根目录 public string getRootTree() { using(SqlDataReader d...
ASP.NET前后台交互之JSON数据
bluecard2008的博客
05-10 968
　最近由于项目需要做一个Ajax的搜集单表单的多重数据的需求，所以就采用了前端JQuery保存Object对象之后转换成JSON的数据源传递给后台处理的这样的形式，相信有不少人大多时候是接收后台给出的JSON数据格式，拿到前端来显示的形式。当然这也是我个人的经历简介而已，高手勿喷，写这篇文章的目的也是为了以后忘记了能够帮助会议。或许真的能够帮助到某些像我一个涉世不深的菜鸟。O(∩_∩)O 　　以...
Asp.net MVC中 model 验证方式 ajax +jquery
fengqingxin的专栏
03-28 182
在项目开发中，最常见的莫过注册，登录，而这其中最常见的莫过于验证了。良好的验证界面会很好的提高用户体验度。 asp.net mvc验证提供了前台的ajax验证方式， 1.非空验证 public class User { public int ID { get; set; } [DisplayName("姓名")] [Required(ErrorMess...
ASP.net难点解析
热门推荐
NDK2010_的专栏
12-02 1万+
认识Asp.net 中相对路径与绝对路径 分类： 技术文档2010-01-1217:051490人阅读评论(1)收藏举报 好多人对相对路径与绝对路径老是混淆记不清楚，我从整理了一下，希望对大家的认识有帮助。 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1.Request.Applicat
ASP.NET MVC总结
baiqing9561的博客
11-16 228
一、概述 1、单元测试的NUnit, MBUnit, MSTest, XUnit以及其他的框架 2、ASP.NET MVC 应用的默认目录结构有三个顶层目录： Controllers、Models、Views，控制器类置于 /Controllers 目录之中，数据模型类置于/Models目录之中，视图模板置于 /Views 目录之中。 ASP.NET MVC框架...
ASP.NET 控件详解
dqsh00的专栏
11-30 3059
[原]IFrame的用法 IFrame介绍： 也应该是框架的一种形式，iframe和frame比较相似，但是有一个根本的区别，iframe可以活动，而frame是不可活动的。换句话说，iframe可以指定其坐标位置。 大部分的时候我们用iframe去模拟一些特效。例如我现在要求当前页面执行某个操作，而操作后肯定要有一个跳转的动作。但是一旦跳转，原始页面就没了，这个
Chapter 7: AJAX -- Professional ASP.NET MVC 1.0
weixin_30784501的博客
06-26 555
Chapter 7: AJAX -- Professional ASP.NET MVC 1.0 Overview You're not cool if your web site doesn't have AJAX implemented in one place or another. At least that's the impre...
ASP.NET onkeyup 添加GridView行
weixin_33859504的博客
02-25 126
HTML <table class="borderedTable" cellspacing="0" rules="all" border="1" id="tblInspectionResult" style="width: 99%; border-collapse: collapse;"> <tr> ...
asp.net DropDownList实现二级联动效果
10-22
主要介绍了asp.net DroDownList实现二级联动效果的相关资料,需要的朋友可以参考下
ASP.NET Ajax级联DropDownList实现代码
01-20
· 用户购买产品时选择产品类别、产品名称、产品型号。 以上的例子有一些共同特点： · 上一级（如省）选择后下一级（如市）才可以选择。 · 下一级的内容由上一级的内容决定...那么如何实现无刷新的级联DropDownList
asp.net省市三级联动的DropDownList+Ajax的三种框架(aspnet/Jquery/ExtJs)示例
10-29
前段时间需要作一个的Web前端应用，需要用多个框架，一个典型的应用场景是省市三级联动，基于此应用，特将三种主要的ajax框架略作整理，方便有需要的朋友查阅。
一个好用的MQTT客户端软件
易得者易失
04-30 560
MQTT客户端软件，用于MQTT调试，测试用。
[XR806开发板试用] XR806 调用cjson 实现数据序列化
weixin_47569031的博客
04-29 315
[XR806开发板试用] XR806 调用cjson 实现数据序列化
如何删除BigKey
fishniu35的博客
04-29 297
BigKey内存占用较多，即便时删除这样的key也需要耗费很长时间，导致Redis主线程阻塞，引发一系列问题。优点：底层使用ziplist，空间占用小，可以灵活访问对象的任意字段。缺点：占用空间大、没办法做统一控制。优点：可以灵活访问对象任意字段。缺点：数据耦合，不够灵活。
FME学习之旅---day26
最新发布
summer_corner的博客
05-06 286
【由于工作的需要，会频繁的使用到json文件中存储的wkt格式的坐标数据，需要将其转换成shp；或者人工确定json中某一固定属性对应的值等一些重复枯燥的人工核实任务，所以想看一下FME中能否有较好的解决方法】【由于上周，上班状态不是很好，事情多又杂，没有学习的劲头，就短暂的休息了一下下。双休爬山，给自己上了强度，今天才缓过来，下周又是五一了，估计要到五一后过渡一下，学习的劲头又能恢复了】我们付出一些成本，时间的或者其他，最终总能收获一些什么。
Django框架之视图层
Xiao20000101的博客
05-02 1113
视图函数必须要返回第一个HttpResponse对象，研究三者源码可得出结论。
asp.net dropdownlist二级联动代写代码
08-18
ASP.NET中的DropDownList控件可以通过绑定数据源实现二级联动效果。下面是一个使用C#代码实现的示例: 首先，需要在页面上定义两个DropDownList控件，分别表示一级和二级选项: ``` <asp:DropDownList ID="ddlFirstLevel" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlFirstLevel_SelectedIndexChanged"> </asp:DropDownList> <asp:DropDownList ID="ddlSecondLevel" runat="server"> </asp:DropDownList> ``` 在代码后台，我们需要在Page_Load事件中绑定一级选项的数据源，并在一级选项的选中事件中动态绑定二级选项的数据源: ``` protected void Page_Load(object sender, EventArgs e) { if(!IsPostBack) { // 绑定一级选项的数据源 ddlFirstLevel.DataSource = GetFirstLevelData(); ddlFirstLevel.DataTextField = "Name"; ddlFirstLevel.DataValueField = "ID"; ddlFirstLevel.DataBind(); // 绑定二级选项的初始数据源 ddlSecondLevel.DataSource = GetSecondLevelData(0); // 初始时显示第一个一级选项的二级选项 ddlSecondLevel.DataTextField = "Name"; ddlSecondLevel.DataValueField = "ID"; ddlSecondLevel.DataBind(); } } protected void ddlFirstLevel_SelectedIndexChanged(object sender, EventArgs e) { // 重新绑定二级选项的数据源，根据选中的一级选项 int firstLevelID = Convert.ToInt32(ddlFirstLevel.SelectedValue); ddlSecondLevel.DataSource = GetSecondLevelData(firstLevelID); ddlSecondLevel.DataTextField = "Name"; ddlSecondLevel.DataValueField = "ID"; ddlSecondLevel.DataBind(); } // 获取一级选项的数据源 private DataTable GetFirstLevelData() { // 从数据库或其他途径获取一级选项的数据源 // 返回的DataTable需要包含ID和Name两列，分别表示一级选项的ID和名称 } // 获取二级选项的数据源 private DataTable GetSecondLevelData(int firstLevelID) { // 根据一级选项的ID查询数据库或其他途径获取相应的二级选项数据源 // 返回的DataTable需要包含ID和Name两列，分别表示二级选项的ID和名称 } ``` 以上代码使用了两个DataTable作为示例的数据源，实际使用时需要根据业务需求自行修改数据源的获取逻辑，并将获取到的数据绑定到DropDownList控件上。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值