Gridview中的Javascript会引发其他事件吗?

Gridview中的Javascript会引发其他事件吗?,javascript,asp.net,gridview,.net-4.0,nested,Javascript,Asp.net,Gridview,.net 4.0,Nested,我大致上遵循了来自的概念。模拟嵌套的GridView。 看起来是这样的: 基本上,我正在创建第二行,它是display:none,并希望使用JavaScript切换它 JavaScript和aspx代码: <script type="text/javascript" language="JavaScript"> function detailsToggle(Company_ID) { try { detail_row = docume

我大致上遵循了来自的概念。模拟嵌套的GridView。 看起来是这样的:

基本上,我正在创建第二行,它是
display:none
,并希望使用JavaScript切换它

JavaScript和aspx代码:

<script type="text/javascript" language="JavaScript">
    function detailsToggle(Company_ID) {
        try {
            detail_row = document.getElementById('detailsRow_' + Company_ID);
            parent_row = document.getElementById('parentRow_' + Company_ID);
            img = parent_row.cells[0].firstChild;

            if (detail_row.className !== 'hidden') {
                detail_row.className = detail_row.className + ' hidden';
                img.src = '../Images/icons/+.gif';
            }
            else {
                detail_row.className = detail_row.className.replace(/\bhidden\b/, '');
                img.src = '../Images/icons/-.gif';
            }
        }
        catch(ex) { alert(ex); }
    }
</script>
<style type="text/css">
    .hidden 
    {
        display: none;
    }
</style>
<asp:GridView ID="gvLegalEntityBrowser" DataKeyNames="Company_ID" AutoGenerateColumns="False"
    runat="server" CellPadding="4" ForeColor="#333333" GridLines="None" 
    OnRowDataBound="gvLegalEntityBrowser_RowDataBound" OnPageIndexChanging="pagingIndexChanged"
    AllowPaging="True" PageSize="25" AllowSorting="false">
    <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
               <%--Placeholder --%>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="CompanyCode" HeaderText="CompanyCode" SortExpression="CompanyCode" />
        <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" />
    </Columns>
    <EmptyDataTemplate>No data</EmptyDataTemplate>
    <EditRowStyle BackColor="#999999" />
    <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
    <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
    <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
    <SortedAscendingCellStyle BackColor="#E9E7E2" />
    <SortedAscendingHeaderStyle BackColor="#506C8C" />
    <SortedDescendingCellStyle BackColor="#FFFDF8" />
    <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
</asp:GridView>
JavaScript工作正常,我甚至在瞬间看到了正确的结果:

。。。但父GridView将重建为以下内容:


Q:有人知道是什么原因导致GridView重建吗???

所以。。。这个问题其实很基本。一位同事向我指出了这一点

我使用ImageButton来展开内部表。.NET图像按钮具有Click处理程序和ClientClick处理程序。Click告诉回发时要做什么,ClientClick将传递到JavaScript

显然,即使我没有为Click定义一个目标函数,页面仍然会进行回发。因此,首先javascript工作,然后页面进行回发,将页面搞乱

解决方案:将ImageButton与javascript的单击事件交换为简单图像

//Idea from : http://www.codeproject.com/Articles/160773/Expandable-Rows-in-GridView
protected void gvLegalEntityBrowser_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        GridViewRow gvRow = e.Row as GridViewRow;
        Int64 iCompanyID = 0;   //Get Company_ID for Legal Entity Row
        iCompanyID = System.Convert.ToInt64(gvLegalEntityBrowser.DataKeys[gvRow.RowIndex]["Company_ID"]);
        GridView gvLegalEntityRelation = new GridView();
        gvRow.ID = "parentRow_" + iCompanyID;
        gvRow.ClientIDMode = ClientIDMode.Static;   //Set HTML ID element = control.ID

        //Add javascript toggle button to each row
        System.Web.UI.WebControls.ImageButton toggleButton = new System.Web.UI.WebControls.ImageButton();
        toggleButton.ID = "btnToggle_" + iCompanyID;
        toggleButton.ImageUrl = "../Images/icons/+.gif";
        toggleButton.OnClientClick = "detailsToggle(" + (iCompanyID) + ")";
        gvRow.Cells[0].Controls.Add(toggleButton);
        toggleButton.Attributes.Add("onmouseover","this.style.cursor='hand'");
        toggleButton.Attributes.Add("onmouseout", "this.style.cursor='default'");

        using (dsLegalEntitiesTableAdapters.View_LegalEntityRelationCountTableAdapter daLERelCount = new dsLegalEntitiesTableAdapters.View_LegalEntityRelationCountTableAdapter())
        {
            //Set Details Data Source
            gvLegalEntityRelation.DataSource = daLERelCount.GetRelationsDataByCompanyID(iCompanyID);
            gvLegalEntityRelation.AutoGenerateColumns = true;

            GridViewRow detailsgvRow = new GridViewRow(gvRow.RowIndex + 1, -1, DataControlRowType.EmptyDataRow, DataControlRowState.Normal);
            detailsgvRow.CssClass = "hidden";
            detailsgvRow.ID = "detailsRow_" + iCompanyID;
            detailsgvRow.ClientIDMode = ClientIDMode.Static;    //Set HTML ID element = control.ID
            TableCell cell = new TableCell();
            cell.ColumnSpan = 4;
            cell.BorderStyle = BorderStyle.None;
            cell.Controls.Add(gvLegalEntityRelation);
            detailsgvRow.Cells.Add(cell);
            ((GridView)sender).Controls[0].Controls.Add(detailsgvRow);

            gvLegalEntityRelation.DataBind();
        }
    }
}