Make update panel component change visibility of item outside of the update panel

Question

I have a repeater and the items are editable through an edit button which opens a FormView in edit mode. The formView is initially invisible and the repeater visible. Once edit is pressed the repeater goes invisible then the formview becomes visible with the item to edit.

Once changes have been made the user presses update. This sets the formview invisible and the repeater visible.

The problem is the formview goes invisible but the repeater doesn't become visible. This I think is caused by the fact the formview is within an update panel and the repeater isn't? Only the items in the update panel are being altered on clicking update because it is only a partial page update.

I can't put the repeater within the update panel because there is a requirement that the public view doesn't use javascript.

Does anyone know how I could make the repeater reappear?

<asp:Repeater id="resultsRepeater" runat="server"  DataSourceID="vehiclesDataSource" >
  <ItemTemplate>
    <asp:Label id="makeLabel" runat="server" Text='<%# Eval("Make") %>' />
    <asp:Button id="editButton" runat="server" Text="Edit" CommandArgument='<%# Eval("Id") %>' OnClick="EditButton_Click" />
  </ItemTemplate>
<asp:Repeater>

<asp:UpdatePanel ID="updatePanel" runat="server">
  <ContentTemplate>
    <asp:Panel id="insertUpdatePanel" runat="server" Visible="false">
      <asp:FormView id="editformview" runat="server" DataKeyNames="Id" Datasourceid="VehiclesEditDataSource" >

        <EditItemTemplate>
          <uc:VehiclesEdit ID="VehiclesEdit" runat="server" />
            <asp:Button id="updateButton" runat="server" OnClick="Update_Click" />
        </EditItemTemplate>
      </asp:FormView>
    </asp:Panel>
  </ContentTemplate>
</asp:UpdatePanel>

protected void EditButton_Click(object sender, EventArgs e)
{
  resultsRepeater.Visible = false;
  insertUpdatePanel.Visible = true;
}

protected void Update_Click(object sender, EventArgs e)
{
  resultsRepeater.Visible = true;
  insertUpdatePanel.Visible = false;
}

score 1 · Answer 1 · answered Mar 29 '12 at 22:34

This might help. I had a similar problem and this worked for me. I simply used ScriptManager to register the button (even iterated by row) as a postback control like this:

ScriptManager.GetCurrent(Page).RegisterPostBackControl(updateButton)

This caused a full postback and allowed me to set the visibility of a panel outside the update panel. I hope it works!

score 0 · Answer 2 · edited May 23 '17 at 09:58

REVISED: Add a PostBackTrigger to your UpdatePanel to force a full post-back when your UpdateButton is clicked. This will hide your UpdatePanel and reveal your Repeater again. See final code below:

For more info refer to: https://stackoverflow.com/questions/2545508/how-do-i-force-full-post-back-from-a-button-within-an-updatepanel

<asp:UpdatePanel ID="updatePanel1" runat="server">
<Triggers>
  <asp:PostBackTrigger ControlID="updateButton" />
</Triggers>
<ContentTemplate>
  <asp:Panel ID="Panel1" runat="server" Visible="false">
    <asp:FormView ID="editformview" runat="server" DataKeyNames="Id" DataSourceID="VehiclesEditDataSource">
      <EditItemTemplate>
        <uc:vehiclesedit id="VehiclesEdit" runat="server" />
      </EditItemTemplate>
    </asp:FormView>
  <asp:Button ID="updateButton" runat="server" OnClick="Update_Click" />
  </asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>

Yeah, that will probably work but the updateButton Visibility isn't synchronised with the contents of the FormView anymore. — Coder 2, Mar 08 '11 at 21:39
The above revision should solve this problem. Follow the stackoverflow link to learn more. Hope it helps. — Mark, Mar 19 '11 at 02:29

Make update panel component change visibility of item outside of the update panel

2 Answers2