如何使用asp.net中div标记中的任何其他控件实现嵌套GridView功能
我正在使用嵌套的GridView。如何仅使用div标记和任何其他控件来实现嵌套的GridView功能 Javascript是如何使用asp.net中div标记中的任何其他控件实现嵌套GridView功能,asp.net,html,gridview,Asp.net,Html,Gridview,我正在使用嵌套的GridView。如何仅使用div标记和任何其他控件来实现嵌套的GridView功能 Javascript是 <script language="javascript" type="text/javascript"> function divexpandcollapse(divname) { var div = document.getElementById(divname); var img = document.getElementById('img' + di
<script language="javascript" type="text/javascript">
function divexpandcollapse(divname) {
var div = document.getElementById(divname);
var img = document.getElementById('img' + divname);
if (div.style.display == "none") {
div.style.display = "inline";
img.src = "minus.gif";
} else {
div.style.display = "none";
img.src = "plus.gif";
}
}
</script>
编辑:
可以使用嵌套中继器。在外部转发器中,您必须添加两个转发器,一个用于ItemTemplate,另一个用于AlternatingItemTemplate。您的标记可能如下所示:
<head runat="server">
<title></title>
<script language="javascript" type="text/javascript">
function divexpandcollapse(divname) {
var div = document.getElementById(divname);
var img = document.getElementById('img' + divname);
if (div.style.display == "none") {
div.style.display = "inline";
img.src = "minus.gif";
} else {
div.style.display = "none";
img.src = "plus.gif";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div>
<asp:Repeater ID="rptCountry" runat="server" OnItemDataBound="rptCountry_ItemDataBound">
<HeaderTemplate>
<table style="border: 1px double #df5015" width="300">
<tr>
<th style="background-color: #df5015; font-weight: bold; color: white"></th>
<th style="background-color: #df5015; font-weight: bold; color: white">CountryId</th>
<th style="background-color: #df5015; font-weight: bold; color: white">CountryName</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #E1E1E1">
<td style="width: 20px">
<a href="JavaScript:divexpandcollapse('div<%# Eval("CountryID") %>');">
<img id='imgdiv<%# Eval("CountryID") %>' width="9px" border="0" src="plus.gif" />
</a>
</td>
<td><%#Eval("CountryID") %></td>
<td><%#Eval("CountryName") %></td>
</tr>
<tr style="background-color: #E1E1E1">
<td colspan="3">
<asp:HiddenField ID="hdnCountryID" runat="server" Value='<%#Eval("CountryID") %>' />
<div id='div<%# Eval("CountryID") %>' style="display: none; position: relative; left: 15px; overflow: auto">
<asp:Repeater ID="rptState" runat="server">
<HeaderTemplate>
<table style="border: 1px double #df5015" width="250">
<tr>
<th style="background-color: black; font-weight: bold; color: white">StateID</th>
<th style="background-color: black; font-weight: bold; color: white">StateName</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #E1E1E1">
<td><%#Eval("StateID") %></td>
<td><%#Eval("StateName") %></td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color: White">
<td><%#Eval("StateID") %></td>
<td><%#Eval("StateName") %></td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color: white">
<td style="width: 20px">
<a href="JavaScript:divexpandcollapse('div<%# Eval("CountryID") %>');">
<img id='imgdiv<%# Eval("CountryID") %>' width="9px" border="0" src="plus.gif" />
</a>
</td>
<td><%#Eval("CountryID") %></td>
<td><%#Eval("CountryName") %></td>
</tr>
<tr style="background-color: white">
<td colspan="3">
<asp:HiddenField ID="hdnCountryID" runat="server" Value='<%#Eval("CountryID") %>' />
<div id='div<%# Eval("CountryID") %>' style="display: none; position: relative; left: 15px; overflow: auto">
<asp:Repeater ID="rptState" runat="server">
<HeaderTemplate>
<table style="border: 1px double #df5015" width="250">
<tr>
<th style="background-color: black; font-weight: bold; color: white">StateID</th>
<th style="background-color: black; font-weight: bold; color: white">StateName</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #E1E1E1">
<td><%#Eval("StateID") %></td>
<td><%#Eval("StateName") %></td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color: White">
<td><%#Eval("StateID") %></td>
<td><%#Eval("StateName") %></td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate></table></FooterTemplate>
</asp:Repeater>
</div>
</form>
</body>
结果如下:
不清楚你在问什么。上面的代码怎么了?代码很完美。但我被要求在没有网格视图的情况下实现。如何在没有Gridview的情况下实现相同的功能。首先,我应该显示表/任何控件中的所有状态。如果我选择一行,意味着如果我选择一个州,它应该在州行下方显示城市。与嵌套栅格视图相同。但在这里我不应该使用任何网格视图。抱歉,阿夫扎勒赫,但我需要它类似于嵌套网格视图。在那里我可以一次查看所有细节。应该是这样的。但是没有网格视图。使用任何其他控件,如表格等
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindGridview();
}
}
// This method is used to bind gridview from database
protected void BindGridview()
{
con.Open();
SqlCommand cmd = new SqlCommand("select * from Country", con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds);
con.Close();
gvParentGrid.DataSource = ds;
gvParentGrid.DataBind();
}
protected void gvUserInfo_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
con.Open();
GridView gv = (GridView)e.Row.FindControl("gvChildGrid");
int CountryId = Convert.ToInt32(e.Row.Cells[1].Text);
SqlCommand cmd = new SqlCommand("select * from State where CountryID=" + CountryId, con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds);
con.Close();
gv.DataSource = ds;
gv.DataBind();
}
<head runat="server">
<title></title>
<script language="javascript" type="text/javascript">
function divexpandcollapse(divname) {
var div = document.getElementById(divname);
var img = document.getElementById('img' + divname);
if (div.style.display == "none") {
div.style.display = "inline";
img.src = "minus.gif";
} else {
div.style.display = "none";
img.src = "plus.gif";
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div>
<asp:Repeater ID="rptCountry" runat="server" OnItemDataBound="rptCountry_ItemDataBound">
<HeaderTemplate>
<table style="border: 1px double #df5015" width="300">
<tr>
<th style="background-color: #df5015; font-weight: bold; color: white"></th>
<th style="background-color: #df5015; font-weight: bold; color: white">CountryId</th>
<th style="background-color: #df5015; font-weight: bold; color: white">CountryName</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #E1E1E1">
<td style="width: 20px">
<a href="JavaScript:divexpandcollapse('div<%# Eval("CountryID") %>');">
<img id='imgdiv<%# Eval("CountryID") %>' width="9px" border="0" src="plus.gif" />
</a>
</td>
<td><%#Eval("CountryID") %></td>
<td><%#Eval("CountryName") %></td>
</tr>
<tr style="background-color: #E1E1E1">
<td colspan="3">
<asp:HiddenField ID="hdnCountryID" runat="server" Value='<%#Eval("CountryID") %>' />
<div id='div<%# Eval("CountryID") %>' style="display: none; position: relative; left: 15px; overflow: auto">
<asp:Repeater ID="rptState" runat="server">
<HeaderTemplate>
<table style="border: 1px double #df5015" width="250">
<tr>
<th style="background-color: black; font-weight: bold; color: white">StateID</th>
<th style="background-color: black; font-weight: bold; color: white">StateName</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #E1E1E1">
<td><%#Eval("StateID") %></td>
<td><%#Eval("StateName") %></td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color: White">
<td><%#Eval("StateID") %></td>
<td><%#Eval("StateName") %></td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color: white">
<td style="width: 20px">
<a href="JavaScript:divexpandcollapse('div<%# Eval("CountryID") %>');">
<img id='imgdiv<%# Eval("CountryID") %>' width="9px" border="0" src="plus.gif" />
</a>
</td>
<td><%#Eval("CountryID") %></td>
<td><%#Eval("CountryName") %></td>
</tr>
<tr style="background-color: white">
<td colspan="3">
<asp:HiddenField ID="hdnCountryID" runat="server" Value='<%#Eval("CountryID") %>' />
<div id='div<%# Eval("CountryID") %>' style="display: none; position: relative; left: 15px; overflow: auto">
<asp:Repeater ID="rptState" runat="server">
<HeaderTemplate>
<table style="border: 1px double #df5015" width="250">
<tr>
<th style="background-color: black; font-weight: bold; color: white">StateID</th>
<th style="background-color: black; font-weight: bold; color: white">StateName</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #E1E1E1">
<td><%#Eval("StateID") %></td>
<td><%#Eval("StateName") %></td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr style="background-color: White">
<td><%#Eval("StateID") %></td>
<td><%#Eval("StateName") %></td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</div>
</td>
</tr>
</AlternatingItemTemplate>
<FooterTemplate></table></FooterTemplate>
</asp:Repeater>
</div>
</form>
</body>
//Change the connection string with yours
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["SOConnectionString1"].ToString());
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindRepeater();
}
}
// This method is used to bind gridview from database
protected void BindRepeater()
{
con.Open();
SqlCommand cmd = new SqlCommand("select * from Country", con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataSet ds = new DataSet();
da.Fill(ds);
con.Close();
rptCountry.DataSource = ds;
rptCountry.DataBind();
}
protected void rptCountry_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
var rptState = e.Item.FindControl("rptState") as Repeater ;
var hdnCountryID = e.Item.FindControl("hdnCountryID") as HiddenField ;
int countryId = 0;
DataSet ds = new DataSet();
if (rptState != null && hdnCountryID != null && int.TryParse(hdnCountryID.Value, out countryId))
{
con.Open();
SqlCommand cmd = new SqlCommand("select * from State where CountryID=" + countryId, con);
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(ds);
con.Close();
}
rptState.DataSource = ds;
rptState.DataBind();
}
}