ImageButton in Updatepanel fires only on first Page Load

Question

I have the following Updatepanel:

<asp:UpdatePanel ID="upPopUps" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:Panel ID="panelOverlay" runat="server" class="Overlay" Visible="false">
        </asp:Panel>
        <asp:Panel ID="panelPopUpPanel" runat="server" class="PopUpPanel" Visible="false"
            BorderStyle="Solid" BorderWidth="5px" Height="250px">
            <table style="width: 100%; height: 100%; border-bottom: solid 2; border-top: solid 2;
                border-left: solid 2; border-right: solid 2;">
                <tr>
                    <th style="width: 100%; padding-left: 10px;" colspan="2">
                        <asp:PlaceHolder ID="PopupHeader" runat="server"></asp:PlaceHolder>
                    </th>
                    <th>
                        <asp:ImageButton id="cmdClosePopUp" runat="server" src="../Navigation/PopupImages/Close.png" alt="Close Popup"
                            OnClick="ClosePopup"  align="right" />
                    </th>
                </tr>
                <tr class="border_top">
                    <td colspan="3">
                    </td>
                </tr>
                <tr style="height: 80%">
                    <td align="center">
                        <asp:PlaceHolder ID="PopupMessage" runat="server"></asp:PlaceHolder>
                    </td>

                </tr>
                <tr style="height: 10%">
                    <td colspan="3" style="padding-left: 10px;">
                        <input type="hidden" id="StartDivID" value="0" runat="server" />
                        <input type="hidden" id="NewsCount" value="" runat="server" />
                        <asp:ImageButton runat="server" id="btn_ok" src="../Navigation/PopupImages/Ok_Button.jpg" alt="Close Popup"
                              OnClick="ClosePopup" align="right" />
                    </td>
                </tr>
            </table>
        </asp:Panel>
    </ContentTemplate>
</asp:UpdatePanel>

My problem is that if i click on one of these two Buttons after PageLoad it works fine.

Through $(document).ready(function() i refresh the Page every 60 seconds. The PopUp pops up, but the Buttons do not fire anymore.

        $(document).ready(function() {

                setInterval("RefreshGrid()", 60000);

        });


        function RefreshGrid() {
            var WebGrid1 = ISGetObject("WebGrid1");
            WebGrid1.Refresh();
        }

Do someone has an idea, where could be the problem? Why is it only working on the first pageload?

Answer 1

There's a reserved function called pageLoad that runs at every postback. Bind your events inside it.

function pageLoad() {
    $('#btn_ok, #cmdClosePopUp').click(ClosePopup); //Something like this.
}

It feels like you're losing the link to the handlers when you refresh. This should fix that.