GridView多層嵌套和折疊與展開(修改適合自己使用)
更新時間:2013年01月10日 16:27:43 作者:
這個功能的GridView多層嵌套沒有問題,因為已經(jīng)做了無限次數(shù),但是折疊與展開的功能,卻花上不少時間(網(wǎng)上找資料),雖找到資料可參考,還是了解明它,并修改適合自己程序使用,感興趣的朋友可以了解下
Insus.NET近段時間應朋友的要求,寫一個GridView多層嵌套和折疊與展開。這個功能的GridView多層嵌套沒有問題,因為已經(jīng)做了無限次數(shù),但是折疊與展開的功能,卻花上不少時間(網(wǎng)上找資料),雖找到資料可參考,還是了解明它,并修改適合自己程序使用。效果如下:

站點中多個頁面使用,因此Insus.NET把它寫在一個用戶自定義控件ASCX上。
InsusMenu.ascx
<%@ Control Language="VB" AutoEventWireup="false" CodeFile="InsusMenu.ascx.vb" Inherits="AscxControls_InsusMenu" %>
<!--折疊與展開的Javascript部分-->
<script type="text/javascript" language="javascript">
function ShowHidde(sid, evt) {
evt = evt || window.event;
var target = evt.target || evt.srcElement;
var objDiv = document.getElementById("div" + sid);
objDiv.style.display = objDiv.style.display == "none" ? "block" : "none";
target.title = objDiv.style.display == "none" ? "Show" : "Hide";
var imgid = 'img' + sid;
document.getElementById(imgid).src = objDiv.style.display == "none" ? "Image/+.gif" : "Image/-.gif";
}
</script>
<!--第一層-->
<asp:GridView ID="GridViewYear" runat="server" Width="100%" AutoGenerateColumns="False"
OnRowDataBound="GridViewYear_RowDataBound" ShowHeader="false" BorderWidth="0">
<Columns>
<asp:TemplateField>
<ItemStyle BorderWidth="0" Height="25" />
<ItemTemplate>
<!--下在這個綁定Eval("Year"),是為獲取唯一ID,如果你的記錄有一個主鍵的話,可以綁定主鍵的字段名-->
<img id='img<%# Eval("Year")%>' style="border: 0px;" src="Image/+.gif" onclick="ShowHidde('<%#Eval("Year")%>',event)" />
<!--下面這個綁定,是第一層顯示的文字-->
<%# Eval("Year") & "年"%>
<div id='div<%# Eval("Year")%>' style="display: none;">
<!--第二層-->
<asp:GridView ID="GridViewMonth" runat="server" OnRowDataBound="GridViewMonth_RowDataBound" Width="100%" AutoGenerateColumns="False" ShowHeader="False" BorderWidth="0">
<Columns>
<asp:TemplateField>
<ItemStyle BorderWidth="0" Height="25" />
<ItemTemplate>
<!--這部分的解釋,可參考上面。-->
<img id='img<%# Eval("Month")%>' style="border: 0px; padding-left: 20px;" src="Image/+.gif" onclick="ShowHidde('<%#Eval("Month")%>',event)" />
<%# Eval("Month") & "月"%>
<div id='div<%# Eval("Month")%>' style="display: none;">
<!--第三層-->
<asp:GridView ID="GridViewVideoFile" runat="server" Width="100%" AutoGenerateColumns="False"
ShowHeader="False" BorderWidth="0">
<Columns>
<asp:TemplateField>
<ItemStyle BorderWidth="0" Height="25" />
<ItemTemplate>
<img style="border: 0px; padding-left: 40px; padding-right:5px; width: 16px; height: 16px; vertical-align: middle;" src="Image/m_file.png" /><asp:HyperLink ID="HyperLinkPlayer" runat="server" NavigateUrl='<%# "~/VideoPlayer.aspx?videokey=" & Eval("VideoLibrary_nbr")%>' Text='<%# Eval("OldFileName").Substring(0, Eval("OldFileName").LastIndexOf("."))%>' Target="_blank"></asp:HyperLink>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
InsusMenu.ascx.vb
Imports System.Data
Imports Insus.NET
Partial Class AscxControls_InsusMenu
Inherits System.Web.UI.UserControl
'宣告實例
Dim objVideoLibrary As New VideoLibrary()
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not IsPostBack Then
Data_Binding()
End If
End Sub
Private Sub Data_Binding()
'從數(shù)據(jù)庫獲取數(shù)據(jù),綁定在第一層的GridView
Me.GridViewYear.DataSource = objVideoLibrary.GetYear()
Me.GridViewYear.DataBind()
End Sub
'數(shù)據(jù)綁定在第二層的GridView
Protected Sub GridViewYear_RowDataBound(sender As Object, e As GridViewRowEventArgs)
Dim dvr As DataRowView = DirectCast(e.Row.DataItem, DataRowView)
If e.Row.RowType = DataControlRowType.DataRow Then
If e.Row.FindControl("GridViewMonth") IsNot Nothing Then
Dim Gv As GridView = DirectCast(e.Row.FindControl("GridViewMonth"), GridView)
objVideoLibrary.Year = ConvertData.ToSmallInt(dvr("Year"))
Gv.DataSource = objVideoLibrary.GetMonthByYear()
Gv.DataBind()
End If
End If
End Sub
'數(shù)據(jù)綁定在第三層的GridView
Protected Sub GridViewMonth_RowDataBound(sender As Object, e As GridViewRowEventArgs)
Dim dvr As DataRowView = DirectCast(e.Row.DataItem, DataRowView)
If e.Row.RowType = DataControlRowType.DataRow Then
If e.Row.FindControl("GridViewVideoFile") IsNot Nothing Then
Dim Gv As GridView = DirectCast(e.Row.FindControl("GridViewVideoFile"), GridView)
objVideoLibrary.Year = ConvertData.ToSmallInt(dvr("Year"))
objVideoLibrary.Month = ConvertData.ToTinyInt(dvr("Month"))
Gv.DataSource = objVideoLibrary.GetByYearAndMonth()
Gv.DataBind()
End If
End If
End Sub
End Class

站點中多個頁面使用,因此Insus.NET把它寫在一個用戶自定義控件ASCX上。
復制代碼 代碼如下:
InsusMenu.ascx
<%@ Control Language="VB" AutoEventWireup="false" CodeFile="InsusMenu.ascx.vb" Inherits="AscxControls_InsusMenu" %>
<!--折疊與展開的Javascript部分-->
<script type="text/javascript" language="javascript">
function ShowHidde(sid, evt) {
evt = evt || window.event;
var target = evt.target || evt.srcElement;
var objDiv = document.getElementById("div" + sid);
objDiv.style.display = objDiv.style.display == "none" ? "block" : "none";
target.title = objDiv.style.display == "none" ? "Show" : "Hide";
var imgid = 'img' + sid;
document.getElementById(imgid).src = objDiv.style.display == "none" ? "Image/+.gif" : "Image/-.gif";
}
</script>
<!--第一層-->
<asp:GridView ID="GridViewYear" runat="server" Width="100%" AutoGenerateColumns="False"
OnRowDataBound="GridViewYear_RowDataBound" ShowHeader="false" BorderWidth="0">
<Columns>
<asp:TemplateField>
<ItemStyle BorderWidth="0" Height="25" />
<ItemTemplate>
<!--下在這個綁定Eval("Year"),是為獲取唯一ID,如果你的記錄有一個主鍵的話,可以綁定主鍵的字段名-->
<img id='img<%# Eval("Year")%>' style="border: 0px;" src="Image/+.gif" onclick="ShowHidde('<%#Eval("Year")%>',event)" />
<!--下面這個綁定,是第一層顯示的文字-->
<%# Eval("Year") & "年"%>
<div id='div<%# Eval("Year")%>' style="display: none;">
<!--第二層-->
<asp:GridView ID="GridViewMonth" runat="server" OnRowDataBound="GridViewMonth_RowDataBound" Width="100%" AutoGenerateColumns="False" ShowHeader="False" BorderWidth="0">
<Columns>
<asp:TemplateField>
<ItemStyle BorderWidth="0" Height="25" />
<ItemTemplate>
<!--這部分的解釋,可參考上面。-->
<img id='img<%# Eval("Month")%>' style="border: 0px; padding-left: 20px;" src="Image/+.gif" onclick="ShowHidde('<%#Eval("Month")%>',event)" />
<%# Eval("Month") & "月"%>
<div id='div<%# Eval("Month")%>' style="display: none;">
<!--第三層-->
<asp:GridView ID="GridViewVideoFile" runat="server" Width="100%" AutoGenerateColumns="False"
ShowHeader="False" BorderWidth="0">
<Columns>
<asp:TemplateField>
<ItemStyle BorderWidth="0" Height="25" />
<ItemTemplate>
<img style="border: 0px; padding-left: 40px; padding-right:5px; width: 16px; height: 16px; vertical-align: middle;" src="Image/m_file.png" /><asp:HyperLink ID="HyperLinkPlayer" runat="server" NavigateUrl='<%# "~/VideoPlayer.aspx?videokey=" & Eval("VideoLibrary_nbr")%>' Text='<%# Eval("OldFileName").Substring(0, Eval("OldFileName").LastIndexOf("."))%>' Target="_blank"></asp:HyperLink>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
復制代碼 代碼如下:
InsusMenu.ascx.vb
Imports System.Data
Imports Insus.NET
Partial Class AscxControls_InsusMenu
Inherits System.Web.UI.UserControl
'宣告實例
Dim objVideoLibrary As New VideoLibrary()
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not IsPostBack Then
Data_Binding()
End If
End Sub
Private Sub Data_Binding()
'從數(shù)據(jù)庫獲取數(shù)據(jù),綁定在第一層的GridView
Me.GridViewYear.DataSource = objVideoLibrary.GetYear()
Me.GridViewYear.DataBind()
End Sub
'數(shù)據(jù)綁定在第二層的GridView
Protected Sub GridViewYear_RowDataBound(sender As Object, e As GridViewRowEventArgs)
Dim dvr As DataRowView = DirectCast(e.Row.DataItem, DataRowView)
If e.Row.RowType = DataControlRowType.DataRow Then
If e.Row.FindControl("GridViewMonth") IsNot Nothing Then
Dim Gv As GridView = DirectCast(e.Row.FindControl("GridViewMonth"), GridView)
objVideoLibrary.Year = ConvertData.ToSmallInt(dvr("Year"))
Gv.DataSource = objVideoLibrary.GetMonthByYear()
Gv.DataBind()
End If
End If
End Sub
'數(shù)據(jù)綁定在第三層的GridView
Protected Sub GridViewMonth_RowDataBound(sender As Object, e As GridViewRowEventArgs)
Dim dvr As DataRowView = DirectCast(e.Row.DataItem, DataRowView)
If e.Row.RowType = DataControlRowType.DataRow Then
If e.Row.FindControl("GridViewVideoFile") IsNot Nothing Then
Dim Gv As GridView = DirectCast(e.Row.FindControl("GridViewVideoFile"), GridView)
objVideoLibrary.Year = ConvertData.ToSmallInt(dvr("Year"))
objVideoLibrary.Month = ConvertData.ToTinyInt(dvr("Month"))
Gv.DataSource = objVideoLibrary.GetByYearAndMonth()
Gv.DataBind()
End If
End If
End Sub
End Class
相關(guān)文章
ASP.NET實現(xiàn)圖書管理系統(tǒng)的步驟詳解
這篇文章主要介紹了ASP.NET圖書管理系統(tǒng)簡單實現(xiàn)步驟,本文通過實例截圖展示的形式給大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友可以參考下2019-12-12.net實現(xiàn)微信公眾賬號接口開發(fā)實例代碼
這篇文章主要介紹了.net實現(xiàn)微信公眾賬號接口開發(fā)實例代碼,有需要的朋友可以參考一下2013-12-12Asp.net生成Excel文件并下載(更新:解決使用迅雷下載頁面而不是文件的問題)
Asp.net生成Excel文件并下載(更新:解決使用迅雷下載頁面而不是文件的問題)2012-01-01.net core在服務器端獲取api傳遞的參數(shù)過程
這篇文章主要介紹了.net core在服務器端獲取api傳遞的參數(shù)過程,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-10-10發(fā)布asp.net core時如何修改ASPNETCORE_ENVIRONMENT環(huán)境變量
這篇文章主要介紹了發(fā)布asp.net core時如何修改ASPNETCORE_ENVIRONMENT環(huán)境變量,幫助大家更好的理解和學習使用.net技術(shù),感興趣的朋友可以了解下2021-04-04.NET IoC模式依賴反轉(zhuǎn)(DIP)、控制反轉(zhuǎn)(Ioc)、依賴注入(DI)
這篇文章主要介紹了.NET IoC模式依賴反轉(zhuǎn)(DIP)、控制反轉(zhuǎn)(Ioc)、依賴注入(DI),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2020-06-06