C# asp前台代碼:
<asp:GridView ID="gridview1" OnRowDataBound="gridview1_RowCommand" DataKeyNames="item"
runat="server" AutoGenerateColumns="false" CssClass="table table-bordered table-condensed "
AlternatingRowStyle-BorderStyle="NotSet" EmptyDataText="No Data Find!" ShowHeaderWhenEmpty="True">
<Columns>
<asp:BoundField DataField="item" HeaderText="item">
<HeaderStyle />
</asp:BoundField>
<asp:BoundField DataField="item1" HeaderText="item1">
<HeaderStyle />
</asp:BoundField>
<asp:BoundField DataField="item2" HeaderText="item2">
<HeaderStyle />
</asp:BoundField>
<asp:TemplateField>
<ItemTemplate>
<!---點擊用於列表展開，執行JS函數--->
<span id="btnShowHidden<%#Eval("item") %>" style="float: left; color: white; cursor: pointer; margin: 0 0 0 0; text-align: center;"
onclick="ShowHidden('<%#Eval("item") %>',event)" class="label label-info">展開詳情</span>
<tr>
<td colspan="4">
<div id="div<%#Eval("item") %>" style="display: none;">
<div style="float: left; font-size: small">
L
</div>
<div style="border: 1 solid RGB(40,80,150); position: relative; left: 0px; overflow: auto; width: 98%;">
<!---綁定內層Gridview--->
<asp:GridView ID="gridview2" Width="100%" Height="100%" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="no1" HeaderText="no1">
<HeaderStyle />
</asp:BoundField>
<asp:BoundField DataField="no2" HeaderText="no2">
<HeaderStyle />
</asp:BoundField>
<asp:BoundField DataField="no3" HeaderText="no3">
<HeaderStyle />
</asp:BoundField>
<asp:BoundField DataField="no4" HeaderText="no4">
<HeaderStyle />
</asp:BoundField>
<asp:BoundField DataField="no5" HeaderText="no5">
<HeaderStyle />
</asp:BoundField>
<asp:BoundField DataField="no6" HeaderText="no6">
<HeaderStyle />
</asp:BoundField>
<asp:BoundField DataField="no7" HeaderText="no7">
<HeaderStyle />
</asp:BoundField>
</Columns>
</asp:GridView>
</div>
</div>
</td>
</tr>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
C# CS後台代碼：
protected void Page_Load(object sender, EventArgs e)
{
BindData();
}
//綁定外層Gridview列表
public void BindData()
{
gridview1.DataSource = instance.GetData();
gridview1.DataBind();
}
//綁定內層Gridview列表
protected void gridview1_RowCommand(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
GridView oGridView = (GridView)e.Row.FindControl("gridview2");
if (oGridView != null)
{
string id = gvItem.DataKeys[e.Row.RowIndex].Value.ToString ();
oGridView.DataSource = instance.GetInternalData(id);
oGridView.DataBind();
}
}
}
//導出EXCEL
protected void btnExcel_Click(object sender, EventArgs e)
{
string type = typeDDL.SelectedValue;
Response.ClearContent();
Response.AddHeader("content-disposition", "attachment;filename=xxx.xls");
Response.Charset = "UTF-8";
Response.ContentEncoding = System.Text.Encoding.UTF8;
Response.ContentType = "application/ms-excel";
StringWriter sw = new StringWriter();
HtmlTextWriter htw = new HtmlTextWriter(sw);
gridview1.AllowPaging = false;
gridview1.RenderControl(htw);
Response.Write(sw.ToString());
Response.End();
}
JavaScript代碼:
<script>
/*隱藏嵌套的Gridview*/
function ShowHidden(sid, ev) {
ev = ev || window.event;
var target = ev.target || ev.srcElement;
var oDiv = document.getElementById("div" + sid);
oDiv.style.display = oDiv.style.display == "none" ? "block" : "none";
target.innerHTML = oDiv.style.display == "none" ? "展開詳情" : "收起詳情";
}
</script>
