Asp.net 嵌套的gridview在PageIndexchange之后不会保持展开状态

Asp.net 嵌套的gridview在PageIndexchange之后不会保持展开状态,asp.net,gridview,Asp.net,Gridview,我有一个嵌套的gridview,我希望它在用户单击其中一个分页值后保持展开状态。我在网上找到了一个例子,但它不适合我 如果有人能看出我错在哪里,我将不胜感激 这是我的JavaScript函数,用于扩展/隐藏嵌套网格。它很好用。这也是我设置隐藏值的地方,以标识展开的网格 function DivExpandCollapse(RecipientID) { var div = document.getElementById(RecipientID); var img = documen

我有一个嵌套的gridview,我希望它在用户单击其中一个分页值后保持展开状态。我在网上找到了一个例子,但它不适合我

如果有人能看出我错在哪里,我将不胜感激

这是我的JavaScript函数,用于扩展/隐藏嵌套网格。它很好用。这也是我设置隐藏值的地方,以标识展开的网格

function DivExpandCollapse(RecipientID) {
    var div = document.getElementById(RecipientID);
    var img = document.getElementById('img' + RecipientID);

    if (div.style.display == "none") {
        div.style.display = "inline";
        img.src = "Images/minus.png";
        $("#recdevgvIsExpanded").val("1");
    } else {
        div.style.display = "none";
        img.src = "Images/plus.png";
        $("#recdevgvIsExpanded").val("");
    }
}
此函数用于标识要展开的网格,并应展开该网格。 它进入
if
语句,并且recipientID是正确的。 我构建
div
img
元素的id来设置它们

$(document).ready(function () {
    $("[id*=recdevgvIsExpanded]").each(function () {
        if ($(this).val() == "1") {
            var div = $(this).parent().closest("div");
            $tds = div.find("td");
            var recipientID = $tds.siblings(":first").text();
            var div2 = document.getElementById('div' + recipientID);
            var img = document.getElementById('imgdiv' + recipientID);

            div2.style.display = "inline";
            img.src = "Images/minus.png";
        }
    });
});
这是通过网格行设置扩展值的代码。它还将正确的嵌套网格设置为“展开”

protected void Page_Load(object sender, EventArgs e)
{

    if (!IsPostBack)
    {
        //Get Recipient Info from Database
        populateRecipientInfoGrid();
    }//end if IsPostBack

    //For Re expanding the expanded rows
    foreach (GridViewRow row in RecipientInfoGridView.Rows)
    {
        if (row.RowType == DataControlRowType.DataRow)
        {
            HiddenField IsExpanded = row.FindControl("recdevgvIsExpanded") as HiddenField;
            IsExpanded.Value = Request.Form[IsExpanded.UniqueID];
        }
    }
}
这是PageIndexchange事件。它正确地更新了数据

protected void RecipientDeviceGridView_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
    GridView tgvRecipientDevice = (GridView)sender;    
    tgvRecipientDevice.PageIndex = e.NewPageIndex;
    int tiRecipientID = Convert.ToInt32((tgvRecipientDevice.Parent.FindControl("rigvLblRecipientID") as Label).Text);
    populateDeviceGrid(tgvRecipientDevice, tiRecipientID);
}
这是标记

<asp:GridView ID="RecipientInfoGridView" runat="server" 
    AllowPaging="True" 
    PageSize="10" 
    AutoGenerateColumns="False" 
    Caption="Recipient Information" 
    CaptionAlign="Top"
    CssClass="grid" 
    HorizontalAlign="Left" 
    ShowFooter="True"
    ShowHeaderWhenEmpty="True" 
    DataKeyNames="RecipientID"
    OnPageIndexChanging="RecipientInfoGridView_PageIndexChanging">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <a href="javascript:DivExpandCollapse('div<%# Eval("RecipientID")%>');">
                    <img id="imgdiv<%# Eval("RecipientID")%>" alt="" 
                        width="25px" border="0" src="Images/plus.png" />
                </a>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="RecipientID">
            <ItemTemplate>
                <asp:Label ID="rigvLblRecipientID" runat="server" 
                    Text='<%# Bind("RecipientID") %>' 
                    ClientIDMode="Static">

                </asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <tr>
            <td colspan="100%">
                <div id="div<%# Eval("RecipientID") %>" style="display: none">
                    <asp:GridView ID="RecipientDeviceGridView" runat="server" 
                        AutoGenerateColumns="false" 
                        CssClass="grid" 
                        ShowFooter="true" 
                        Caption="Device Information" 
                        CaptionAlign="Top" 
                        AllowPaging="true" 
                        PageSize="1" 
                        HorizontalAlign="Left" 
                        OnPageIndexChanging="RecipientDeviceGridView_PageIndexChanging">
                        <Columns>
                            <asp:TemplateField HeaderText="DeviceID">
                                <ItemTemplate>
                                    <asp:Label ID="recdevgvLblDeviceID" runat="server" 
                                        Text='<%# Bind("DeviceID") %>'>
                                    </asp:Label>
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:TemplateField HeaderText="Device" ItemStyle-Wrap="false">
                                <ItemTemplate>
                                    <asp:Label ID="recdevgvLblDeviceName" runat="server" 
                                        Text='<%# Bind("DeviceName") %>'>
                                    </asp:Label>
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:TemplateField HeaderText="Service Provider">
                                <ItemTemplate>
                                    <asp:Label ID="recdevgvLblServiceName" runat="server" 
                                        Text='<%# Bind("ServiceName") %>'>
                                    </asp:Label>
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:TemplateField HeaderText="Address">
                                <ItemTemplate>
                                    <asp:Label ID="recdevgvLblAddress" runat="server" 
                                        Text='<%# Bind("Address") %>'>
                                    </asp:Label>
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:TemplateField HeaderText="Active">
                                <ItemTemplate>
                                    <asp:Label ID="recdevgvLblActive" runat="server" 
                                        Text='<%# (Boolean.Parse(Eval("Active").ToString())) ? "Yes" : "No" %>'>
                                    </asp:Label>
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:TemplateField HeaderText="Action" 
                                ShowHeader="False" 
                                ItemStyle-Wrap="false" 
                                ItemStyle-HorizontalAlign="Center">
                                <ItemTemplate>
                                    <asp:Button ID="recdevgvEditButton" runat="server" 
                                        CausesValidation="True" 
                                        CommandName="Edit" 
                                        Text="Edit" 
                                        CssClass="gridActionbutton" 
                                        ValidationGroup="EditDeviceValidation">
                                    </asp:Button>
                                    &nbsp;
                                    <asp:Button ID="recdevgvDeleteButton" runat="server" 
                                        CausesValidation="False" 
                                        CommandName="Delete" 
                                        Text="Delete" 
                                        CssClass="gridActionbutton" 
                                        OnClientClick="return confirm('Are you sure you want to delete this Device Information?')">
                                    </asp:Button>
                                </ItemTemplate>
                            </asp:TemplateField>
                        </Columns>
                    </asp:GridView>
                </div>
                <asp:HiddenField ID="recdevgvIsExpanded" runat="server" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

我需要标识与“div”和“img”关联的隐藏字段。如何做到这一点?

您的网格不在UpdatePanel中,因此每次更改索引都会生成完整的帖子,这意味着重新创建整个页面,您需要将网格放在更新面板中,还需要添加ScriptManager,之后,您需要编写一个JS函数,在脚本管理器请求完成时扩展网格(听起来需要做很多工作,但实际上不是)

有关更新面板控件的一些文档:


更新面板对我不起作用。我使用了占位符和文字,这有助于我,但导致css问题

但是下面的代码解决了我的问题

希望这能帮助那些面临更新面板不起作用的问题的人

    $(function () {
        $("[src*=minus]").each(function () {
            $(this).closest("tr").after("<tr><td></td><td colspan = '999'>" + $(this).next().html() + "</td></tr>");
            $(this).next().remove()
        });
    });


添加asp.net标记将在这个问题上提供更多答案。为什么不删除客户端代码的bug?您是否一次扩展多个子网格?展开新的子轴号时,应关闭所有其他子轴网。我当前的任务只是更改一个子网格的页面索引。发生此事件时,子栅格将隐藏/折叠。当我重新展开网格时,页面索引将显示下一个值。我只想让儿童网络在整个活动中保持开放。谢谢你的建设性回答。所以,我不需要隐藏字段?您仍然需要它,这样您就可以在更新面板请求完成时跟踪网格是否展开。好的。让我添加UpatePanel,看看会发生什么:)
//example
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
 function()
 {
      //here you'll expand the grid
 });
    $(function () {
        $("[src*=minus]").each(function () {
            $(this).closest("tr").after("<tr><td></td><td colspan = '999'>" + $(this).next().html() + "</td></tr>");
            $(this).next().remove()
        });
    });
<asp:GridView ID="gv_Parent" AutoGenerateColumns="False" 
DataKeyNames="Id" Font-Size="12px" Width="100%" runat="server"  
AllowPaging="true" PageSize="10" OnPageIndexChanging="OnPageIndexChanging">

<Columns>

<asp:ImageButton ID="imgShow" runat="server" OnClick="Show_Hide_ChildGrid" 
ImageUrl="../../../assets/img/plus.png" CommandArgument="Show" />

<asp:Panel ID="pnlOrders" runat="server" Visible="false" Style="position: 
relative">

<div id="divgvTargetInfo" runat="server"  class="table-responsive">

<asp:GridView ID="gvChild" AutoGenerateColumns="False" 
DataKeyNames="Id"  runat="server" 
OnPageIndexChanging="OnTargetPageIndexChanging" AllowPaging="true" 
pagesize="10">

<Columns>


</columns>
</asp:GridView>  --closing Child Grid
</asp:Panel>
</columns>
</asp:GridView>  --closing Parent Grid
 protected void Show_Hide_ChildGrid(object sender, EventArgs e)
  {
  ImageButton imgShowHide = (sender as ImageButton);
  GridViewRow row = (imgShowHide.NamingContainer as GridViewRow);
  if (imgShowHide.CommandArgument == "Show")
    {

      row.FindControl("pnlOrders").Visible = true;
       mgShowHide.CommandArgument = "Hide";
imgShowHide.ImageUrl = "../../../assets/img/minus.png";
GridView gvwChild = row.FindControl("gvChild") as GridView;

BindChildGrid(Convert.ToInt32(gv_Parent.DataKeys[row.RowIndex].Value), 
gvwChild);

 }
else
 {
 row.FindControl("pnlOrders").Visible = true;
 imgShowHide.CommandArgument = "Hide";
 imgShowHide.ImageUrl = "../../../assets/img/minus.png";

GridView gvwChild = row.FindControl("gvChild") as GridView;

BindchildGrid(Convert.ToInt32(gv_Parent.DataKeys[row.RowIndex].Value), 
gvwChild);
 }
 }
else
{
row.FindControl("pnlOrders").Visible = false;
mgShowHide.CommandArgument = "Show";
mgShowHide.ImageUrl = "../../../assets/img/plus.png";
}
}
protected void OnPageIndexChanging(object sender, GridViewPageEventArgs e)
{

    gv_Parent.PageIndex = e.NewPageIndex;
    this.BindGVTSPBA();
}

protected void OnTargetPageIndexChanging(object sender, 
GridViewPageEventArgs e)
{
GridViewRow gvRowParent = (((GridView)sender)).DataItemContainer as 
GridViewRow;

GridView gvwChild = ((GridView)sender);
gvwChild.PageIndex = e.NewPageIndex;
BindChildGrid
(Convert.ToInt32(gv_Parent.DataKeys[gvRowParent.RowIndex].Value), 
gvwChild);
}