用.net生成javascript后,再实现二层菜单的级联

最新推荐文章于 2025-12-15 15:15:21 发布
最新推荐文章于 2025-12-15 15:15:21 发布 · 88 阅读 · 0
文章标签：

#javascript #ui #c# #ViewUI

本文介绍了一个使用ASP.NET实现的DropDownList控件联动选择功能的例子。通过C#后端代码，从数据库获取数据并填充两个下拉列表，实现根据大类自动更新小类选项的功能。
<%...@Pagelanguage="c#"Codebehind="WebForm1.aspx.cs"AutoEventWireup="false"Inherits="mytest.WebForm1"%>
<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN">
<HTML>
<HEAD>
<title>WebForm1</title>
<metaname="GENERATOR"Content="MicrosoftVisualStudio.NET7.1">
<metaname="CODE_LANGUAGE"Content="C#">
<metaname="vs_defaultClientScript"content="JavaScript">
<metaname="vs_targetSchema"content="http://schemas.microsoft.com/intellisense/ie5">
<script>...
vararry=newArray();
<%
for(inti=0;i<cdt.Rows.Count;i++)
...{
%>
arry[<%=i%>]=newArray("<%=cdt.Rows[i]["d_id"]%>","<%=cdt.Rows[i]["subname"]%>","<%=cdt.Rows[i]["sub_id"]%>");//注意这里的Array的使用，里面有三个下标，第一个下标索引为0
<%
}
%>
functionbindsub(value)
...{
document.getElementById("dlsmall").length=0;
for(vari=0;i<arry.length;i++)
...{
if(arry[i][0]==value)//重点：用于判断是不是选中的大类所对应的小类
...{
document.getElementById("dlsmall").options.add(newOption(arry[i][1],arry[i][2]));//arry[i][1]指arry数组里的下标为１的元素值
}
}
}
</script>
</HEAD>
<bodyMS_POSITIONING="GridLayout">
<formid="Form1"method="post"runat="server">
<FONTface="宋体">
<asp:DropDownListid="dlbig"style="Z-INDEX:101;LEFT:296px;POSITION:absolute;TOP:192px"runat="server"></asp:DropDownList>
<asp:DropDownListid="dlsmall"style="Z-INDEX:102;LEFT:440px;POSITION:absolute;TOP:192px"runat="server"></asp:DropDownList>
<asp:Buttonid="Button1"style="Z-INDEX:103;LEFT:376px;POSITION:absolute;TOP:264px"runat="server"
Text="Button"></asp:Button>
<asp:Labelid="Label1"style="Z-INDEX:104;LEFT:296px;POSITION:absolute;TOP:80px"runat="server"
Width="312px"ForeColor="Red">Label</asp:Label></FONT>
</form>
</body>
</HTML>

cs代码如下:

usingSystem;
usingSystem.Collections;
usingSystem.ComponentModel;
usingSystem.Data;
usingSystem.Drawing;
usingSystem.Web;
usingSystem.Web.SessionState;
usingSystem.Web.UI;
usingSystem.Web.UI.WebControls;
usingSystem.Web.UI.HtmlControls;
usingSystem.Configuration;
usingSystem.Data.SqlClient;

namespacemytest
...{
/**////<summary>
///WebForm1的摘要说明。
///</summary>
publicclassWebForm1:System.Web.UI.Page
...{
privatereadonlystringconnstr=ConfigurationSettings.AppSettings["connstr"].ToString();
protectedSystem.Web.UI.WebControls.DropDownListdlbig;
protectedSystem.Web.UI.WebControls.DropDownListdlsmall;
protectedSystem.Web.UI.WebControls.ButtonButton1;
protectedSystem.Web.UI.WebControls.LabelLabel1;
protectedDataTablecdt;//这里是html页面中要用到的datatable对象，所以必须将其设为公共的
privatevoidPage_Load(objectsender,System.EventArgse)
...{
if(!Page.IsPostBack)
...{
cdt=GetTB("select*fromsubunionaddress");
this.dlbig.Attributes.Add("onchange","bindsub(this.value)");
bindbig();
}
}

privatevoidbindbig()
...{
stringsql="select*fromunionaddress";
DataTabledt=GetTB(sql);
this.dlbig.DataTextField="name";
this.dlbig.DataValueField="d_id";
this.dlbig.DataSource=dt;
this.dlbig.DataBind();
}

privateDataTableGetTB(stringsql)
...{
SqlConnectionmyconn=newSqlConnection(connstr);
SqlDataAdapteradpt=newSqlDataAdapter(sql,myconn);
DataSetds=newDataSet();
adpt.Fill(ds);
return(DataTable)ds.Tables[0];
}

Web窗体设计器生成的代码#regionWeb窗体设计器生成的代码
overrideprotectedvoidOnInit(EventArgse)
...{
//
//CODEGEN:该调用是ASP.NETWeb窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}

/**////<summary>
///设计器支持所需的方法-不要使用代码编辑器修改
///此方法的内容。
///</summary>
privatevoidInitializeComponent()
...{
this.Button1.Click+=newSystem.EventHandler(this.Button1_Click);
this.Load+=newSystem.EventHandler(this.Page_Load);

}
#endregion

privatevoidButton1_Click(objectsender,System.EventArgse)
...{
stringbig=dlbig.SelectedValue.ToString();
stringnobig=dlsmall.SelectedValue.ToString();
stringsmall=Request.Form["dlsmall"].ToString();
//this.Label1.Text="当前你选定的是"+big.ToString()+"地区,"+small.ToString()+"市";
}
}
}

iteye_6481
关注
常规技术面试题（.NET）下一部分
weixin_46412204的博客
11-07 1388
1.你对泛型了解吗？简单说明一下泛型的有什么好处？ 泛型：“泛型”的字面意思就是广泛的类型。通过参数化类型来实现在同一份代码上操作多种数据类型。利用“参数化类型”将类型抽象化，从而实现灵活的复用好处是——可以复用代码，降低耦合性，而且还提高了代码的可读性以及安全性。 DateTime.Parse(myString); 这行代码有什么问题？ 有问题，当myString不能满足时间格式要求的时候，会引发异常，建议使用DateTime.TryParse() XML 与HTML的主要区别？ 1. XML...
TreeView Javascrip实现级联选择
05-28
TreeView Javascrip实现级联选择
C# JavaScript自定义控件，省市区三级联动选择，动态加载数据
lwpoor123的博客
06-22 1751
之前写了一个三级联动选择自定义控件，分享给大家。 这是控件截图： 下面是代码：测试页面代码: <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <link href="../../../scripts/artdia
级联下拉选，动态生成<option>标签实现，以及第二个下拉选无法显示问题
qq_20565303的专栏
09-19 919
来源：http://blog.csdn.net/qigc_0529/article/details/52318347 JSP+Jquery+Oracle实现省市区三级联动下拉选菜单 自己搞了一下午,刚开始觉得还有点麻烦,不过搞过一遍之后就觉得简单了,供大家互相学习,具体代码如下: 1.jsp页面代码： [javascript] view pl
10、ASP.NET AJAX控件工具包使用指南
ggg99的专栏
08-13 29
本文详细介绍了ASP.NET AJAX控件工具包的使用方法和功能，包括ObjectDataSource控件的配置、多种扩展器控件（如手风琴控件、自动完成扩展器、日历扩展器等）的使用场景和示例代码。同时，还提供了控件组合使用的示例以及性能优化建议，帮助开发者提升ASP.NET Web应用程序的用户体验和交互性。
.NET常见面试题
ssINT的博客
09-21 904
一、 .NET基础部分 Linq查询，lambda表达式 LINQ（Language Integrated Query，语言集成查询）提供了一种跨数据源和数据格式的统一模型，实现查询。主要包括三个部分：LINQ to Objects、LINQ to XML、LINQ enabled ADO.NET，而在LINQ enabled ADO.NET中又包括LINQ to DataSet、LINQ to SQL 和 LINQ to Entities。 “Lambda 表达式”是一种简化的...
RDIFramework.NET ━ .NET快速信息化系统开发框架 V2.8 版本发布
热门推荐
.NET快速开发框架
01-03 1万+
历时数月，RDIFramework.NET V2.8版本发布了，感谢大家的支持。　　 RDIFramework.NET，基于.NET的快速信息化系统开发、整合框架，为企业或个人在.NET环境下快速开发系统提供了强大的支持，开发人员不需要开发系统的基础功能和公共模块，框架自身提供了强大的函数库和开发包，开发人员只须集中精力专注于业务部分的开发，因此大大提高开发效率和节约开发成本。框架采用目前最主流的C#语言开发完成，支持多种数据库类型，支持WinForm与Web。使用RDIFramework.NET能提高管理
一些常用的技巧（内容设计到asp.net,javascript,sqlserver等）
11-03 1310
 使用SqlBulkCopy类加载其他源数据到SQL表在数据回发时，维护ASP.NET Tree控件的位置vagerent的vs2005网站开发技巧ASP.NET2.0小技巧－－内部控件权限的实现图片滚动代码。css——之三行三列等高布局Datagird TemplateColumn类型列中如何设定日期格式为yyyy-MM-dd格式？SQL Server各种日期计算方法在sqlserver中如何根
利用 ASP.NET、JavaScript 和 OLE DB 从头设计您自己的网络日记应用程序
Jerry Chou's Space
10-05 1626
多数情况下，ASP.NET 高级模板化控件（如 DataList 和 DataGrid）是用于数据表示的最佳选择。但是，当需要灵活地进行各种各样的布局时，Repeater 控件就是您所需要的。在本文中，作者将构建一个功能齐备的网络日记应用程序，以举例说明使用 Repeater 和 DataList 控件来呈现主从关系中嵌套数据的方法。然后，作者将介绍如何通过添加一些使网络日记反应更迅速且可用性更高
基于Jquery的级联下拉菜单实现与ASP.NET AJAX交互
在级联下拉菜单的上下文中，ASP.NET一般处理程序通常会返回JSON格式的数据，前端JavaScript可以轻松地解析这些数据，并使用它们来填充第二个下拉菜单。 以下是一个简化的实现级联下拉菜单的知识点总结： 1. HTML...
基于ASP.NET实现无限级联菜单DropdownList
在本案例中，“级联菜单”指的是通过ASP.NET实现的多级联动下拉菜单，用户在选择上一级菜单项后，会自动触发加载下一级菜单选项的机制。 级联菜单的核心在于“级联”两个字，意味着菜单项之间存在逻辑上的父子关系...
基于ASP.NET的TreeView无限级分类树实现
JavaScript会触发Ajax请求，向服务器发送该节点的ID，服务器端（ASPX页面或ASHX处理程序）接收到请求后，从Access数据库中查询所有ParentID等于该ID的子节点，将其格式化为JSON或XML格式返回给前端，前端再解析数据...
基于ajaxPro实现三级联动下拉框与服务器回调
深入剖析其中涉及的核心技术知识点，涵盖AJAX原理、ajaxPro框架的应用、ASP.NET后端处理机制、JavaScript与服务器方法的异步通信方式（包括回调函数的使用）、参数传递机制以及三级联动菜单的具体实现逻辑。...
JQuery和ASP.NET分别实现级联下拉框效果
王雅瑾---上善若水，水善利万物而不争
07-03 5627
在学习Javascript之前知道下拉框的级联效果
JavaScript 根据数组对象的某个 指定属性 分组合并，并累加金额
最新发布
zhangyao940330的博客
12-15 205
item } 浅拷贝原对象的所有属性（如 id、name），合并时仅更新金额，其他属性保留第一个分组对象的值（若需保留所有属性，可修改为数组存储，如 name: [‘苹果’, ‘香蕉’]）。分组逻辑：用 Map 存储分组，键为 groupKey 的值（如 ‘水果’），值为合并后的对象。Map 比普通对象更安全（避免键名冲突，支持数字 / 对象等类型的键）。缺失金额或非数字（如 undefined、‘abc’）视为 0。字符串金额（如 ‘8’）自动转为数字；扩展需求：保留分组内所有非金额属性。
商城后台管理系统 02 添加规格参数-动态表单
weixin_52943021的博客
12-15 257
Boolean。
JavaScript 实现二级菜单级联效果示例
资源摘要信息: "JavaScript 事件处理 二级菜单级联 示例代码" 知识点: 1. JavaScript 事件处理概念：JavaScript 事件处理是指在用户与网页交互过程中发生的各种事件，如鼠标点击、键盘按键、页面加载等。JavaScript...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值