C#实现DataList里面嵌套DataList的折叠菜单

2024-10-23 09:43:12

本文实例讲述了C#实现DataList里面嵌套DataList的折叠菜单。分享给大家供大家参考，具体如下：

点击前效果图如下：

点击后效果图如下：

具体实现代码如下：

Javascript脚本

<script type="text/javascript">
function showmenu(id)
{
smallimg = eval("smallimg"+id);
img =eval("img"+id);
if(smallimg.style.display =="none")
{
eval("smallimg"+id+".style.display=\"\";");//全部显示
img.src="Image/tree_folder3.gif";//显示为-
}
else
{
eval("smallimg"+id+".style.display=\"none\";"); //全部隐藏
img.src="Image/tree_folder4.gif";//显示为+
}
}
</script>

HTML代码如下：

<body>
<form id="Form1" method="post" runat="server">
<font face="宋体"></font>
<table width="679" height="100%" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="center" valign="top">
<strong>版块 设 置</strong>
<br />
<br />
管理选项：<asp:Button ID="btnAdd" runat="server"
OnClick="btnAdd_Click" Text="添加一级版块"/><br />
<br />
<asp:DataList ID="DataList1" runat="server" CellSpacing="0" CellPadding="0" Width="679"
OnItemDataBound="DataList1_ItemDataBound">
<HeaderTemplate>
<table width="679" border="0" cellpadding="0" cellspacing="0" bgcolor="#000000" class="border">
<tr bgcolor="#a4b6d7" class="title">
<td height="25" align="center">
<strong>版块名称</strong></td>
<td height="20" align="center">
<strong>操作选项</strong></td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr bgcolor="ECF5FF" class="tdbg">
<td height="22" width="50%">
<img id="img<%#Eval("BigClassID")%>" src="Image/tree_folder4.gif" width="15" height="15" onclick="showmenu(<%#Eval("BigClassID")%>)"><%#Eval("BigClassName")%></td>
<td align="center" width="50%">
<a href='SmallClassAdd.aspx?BigClassID=<%#Eval("BigClassID")%>'>
添加二级版块</a> | <a href='BigClassModify.aspx?BigClassID=<%#Eval("BigClassID")%>'>
修改一级版块</a> | <a href='BigClassDelete.aspx?BigClassID=<%#Eval("BigClassID")%>'
onclick="return confirm('确定删除吗,下级版块及相关帖子都将被删除,且不可恢复!!!')">删除一级版块</a></td>
</tr>
<tr bgcolor="ECF5FF" class="tdbg" width="100%">
<td colspan="2" width="100%">
<asp:DataList ID='dlstSmallClass' EnableViewState='false' runat='server'>
<HeaderTemplate>
<table width="679" border="0" cellpadding="0" cellspacing="0" bgcolor="#000000" class="border">
</HeaderTemplate>
<ItemTemplate>
<tr id="smallimg<%#Eval("BigClassID")%>" style="display:none" bgcolor="#E3E3E3" class="tdbg">
<td height="22" width="50%" colspan="3">
        
<img src="Image/tree_folder3.gif" width="15" height="15"><%#Eval("SmallClassName")%></td>
<td align="center" width="50%" colspan="3">
            
<a href='SmallClassModify.aspx?SmallClassID=<%#Eval("SmallClassID")%>'>
修改二级版块</a> | <a href='SmallClassDelete.aspx?SmallClassID=<%#Eval("SmallClassID")%>'
onclick="return confirm('确定删除吗,相关帖子都将被删除,且不可恢复!!!')">删除二级版块</a></td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:DataList>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:DataList>
</td>
</tr>
</table>
</form>
</body>

上面的功能有点缺陷（ques1:多行时候不能折叠，默认只折叠第一行；ques2:不支持IE），现在改善如下：

<script type="text/javascript">
function showmenu(id)
{
var smallimg = document.getElementById("smallimg"+id);
var img = document.getElementById("img"+id);
if(smallimg.style.display =="none")
{
smallimg.style.display="";
img.src="Image/tree_folder3.gif";//显示为-
}
else
{
smallimg.style.display ="none";
img.src="Image/tree_folder4.gif";//显示为+
}
}
</script>

<body>
<form id="Form1" method="post" runat="server">
<font face="宋体"></font>
<table width="679" height="100%" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="center" valign="top">
<strong>版 块 设 置</strong>
<br />
<br />
管理选项：<asp:Button ID="btnAdd" runat="server" OnClick="btnAdd_Click" Text="添加一级版块"/><br />
<br />
<asp:DataList ID="DataList1" runat="server" CellSpacing="0" CellPadding="0" Width="679"
OnItemDataBound="DataList1_ItemDataBound">
<HeaderTemplate>
<table width="679" border="0" cellpadding="0" cellspacing="0" bgcolor="#000000"class="border">
<tr bgcolor="#a4b6d7"class="title">
<td height="25" align="center">
<strong>版块名称</strong>
</td>
<td height="20" align="center">
<strong>操作选项</strong>
</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr bgcolor="ECF5FF"class="tdbg">
<td height="22" width="50%">
<img id="img<%#Eval("BigClassID")%>" src="Image/tree_folder4.gif" width="15" height="15"
onclick="showmenu(<%#Eval("BigClassID")%>)"><%#Eval("BigC <td align="center" width="50%" colspan="3">
             <a href='SmallClassModify.aspx?SmallClassID=<%#Eval("SmallClassID")%>'>
修改二级版块</a>|<a href='SmallClassDelete.aspx?SmallClassID=<%#Eval("SmallClassID")%>'
onclick="return confirm('确定删除吗,相关帖子都将被删除,且不可恢复!!!')">删除二级版块</a>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:DataList>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:DataList>
</td>
</tr>
</table>
</form>
</body>

希望本文所述对大家C#程序设计有所帮助。

C#自定义控件添加右键菜单的方法

C#自定义控件添加右键菜单非常简单,主要用到控件,像control定义右键菜单,用items.add()叠加右键菜单内容,用click事件处理函数. 1.control是要定义右键菜单的控件. private void control_MouseDown(object sender, MouseEventArgs e) { if (e.Button == MouseButtons.Right) { ContextMenu menu = new rightClickMen
C#实现基于XML配置MenuStrip菜单的方法

本文实例讲述了C#实现基于XML配置MenuStrip菜单的方法.分享给大家供大家参考.具体如下: 1.关于本程序的说明用XML配置MenuStrip菜单,本程序只是提供一个思路.程序在Load函数中根据XML文件中的设置动态生成一个MenuStrip组件的Items集合. 程序示例如下: 2.使用到的XML文档示例 <?xml version="1.0" encoding="gb2312"?> <!--MenuStrip:mnsMainMenu
使用c#开发公众平台自定义菜单功能

复制代码代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="cm.aspx.cs" Inherits="guotaotao_weixin.cm" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w
Android仿微信菜单(Menu)（使用C#和Java分别实现）

本篇是对安卓菜单使用编程方式实现,当然可以使用XML的方式完成同样的功能,基本Java和C#写法都是一致的,所以使用XML的方式在本篇中使用Java演示,需要注意的是,对于如果不是VS开发的话,那么资源文件名称必须以小写开头,否则会报错. 运行效果 C#实现 using Android.App; using Android.OS; using Android.Views; using Android.Widget; namespace MenuDemo { [Activity(Label = "
C#设置右键菜单的方法

本文实例讲述了C#设置右键菜单的方法.分享给大家供大家参考.具体实现方法如下: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Text; using System.Windows.Forms; namespace WindowsApplication1 { public partia
c# TreeView添加右键快键菜单有两种方法

一种就是使用TreeView的ContextMenuStrip属性,添加一个新ContextMenuStrip,这个方法非常的简答直接,缺点是右键菜单是整个控件响应的,也就是说即使没有右键选中节点也是会触发快捷菜单的显示这种方法里获取哪一个的node选中是通过这个方法: 复制代码代码如下: TreeNode curNode = this.trvFolder.GetNodeAt(e.X, e.Y) 另一种是创建ContextMenuStrip,并且使用TreeView的NodeMouseCli
asp.net(C#)生成无限级别菜单

首先,创建数据库表的代码如下: 无限级树的数据库表代码复制代码代码如下: if exists (select * from dbo.sysobjects where id = object_id(N'[dbo].[work_sysmenu]') and OBJECTPROPERTY(id, N'IsUserTable') = 1) drop table [dbo].[work_sysmenu] GO CREATE TABLE [dbo].[work_sysmenu] ( [flowid] [
c# winform读取xml文件创建菜单的代码

复制代码代码如下: using System;using System.Collections.Generic;using System.ComponentModel;using System.Data;using System.Drawing;using System.Linq;using System.Text;using System.Windows.Forms;using WinformMenu.Helper;using System.Xml; namespace WinformMen
C#使用XML序列化操作菜单的方法

本文实例讲述了C#使用XML序列化操作菜单的方法.分享给大家供大家参考.具体分析如下: 之前的一篇文章<C#递归读取XML菜单数据的方法>没使用XML序列化来操作菜单,而且发现那还有一个问题,就是在XML菜单的某个菜单节点前加上一些注释代码的就不能读取,现在使用XML序列化后可以很方便的读取,故在此写一写. XML菜单的节点代码如下: 复制代码代码如下: <?xml version="1.0" encoding="utf-8"?> &l
基于C#实现的仿windows左侧伸缩菜单效果

本文所述为基于C#实现的折叠菜单,风格仿照Windows打开我的电脑后左侧的伸缩菜单效果,并且同样是蓝色的效果,看着和windows的效果一样漂亮,可以实现折叠.展开等功能.这在学习C#界面编程的时候能用上,其主要实现代码如下: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq
C#递归读取XML菜单数据的方法

本文实例讲述了C#递归读取XML菜单数据的方法.分享给大家供大家参考.具体分析如下: 最近在研究一些关于C#的一些技术,纵观之前的开发项目的经验,做系统时显示系统菜单的功能总是喜欢把数据写在数据库表,然后直接读取加载到菜单树上显示. 现在想把菜单数据都放在XML里,然后递归读取XML. 由于项目使用WCF,实体类使用了两个,一个是业务逻辑层中的实体,一个是调用业务逻辑层递归方法后进行数据实体的转换,XML读取方法写在业务逻辑层中. 思路: 1.先读取XML里所有的菜单 2.根据用户的权限显示所属

C#实现DataList里面嵌套DataList的折叠菜单

相关推荐

随机推荐