how to stop ajax modal popup from closing in an update panel that is running a timer

Question

I have an asp update panel that contains a repeater with items bound to a dataset showing the names of tables on which a particular sql query is about to run. For each item in the repeater I also show the status of the query (Waiting/Running/Completed), when the query started, and when the query finished.

When the user presses a run button, each table is queried in turn, and the status/start time/end time are all updated to give the user feedback as to where the queries are up to. This is all achieved using asp:timer and asp:AsyncPostBackTrigger. As each query finishes a "data preview" button is also unhidden that opens an ajax modal popup box to show the data extracted.

My issue is that if a user presses the data preview button whilst the timer is still running, the popup opens and then immediately closes. Once all queries have finished and the timer is closed, all is fine - but I would like the user to be able to able to preview the results of each query at the point they finish.

I have found on other forums the suggestion to move the modal popup box out of the update panel, but then I can't find a way to link the repeater buttons to the popup controls.

Any ideas?

ASPX page extract:

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

<asp:Timer runat="server" ID="Timer1" Interval="1000" Enabled="false" ontick="Timer1_Tick" />

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
    </Triggers>
    <ContentTemplate>
        <asp:ImageButton ID="Export" ImageUrl='/Stock/Some.png' runat="server" Enabled="False" Visible="False" />
        <br />
        <br />
        <asp:Repeater ID="rptTbl" runat="server">

            <HeaderTemplate>
                <h3>Querying Tables:</h3>
                <table id="Tbls" class="table">
                    <tr>
                        <td width="40%" style="border-right: 1px solid #494444; border-bottom: 1px solid #494444" >
                            <b>Table Name</b>
                        </td>
                        <td width="20%" style="border-right: 1px solid #494444; border-bottom: 1px solid #494444" >
                            <b>Status</b>
                        </td>
                        <td width="15%" style="border-right: 1px solid #494444; border-bottom: 1px solid #494444" >
                            <b>Query Start</b>
                        </td>
                        <td width="15%" style="border-right: 1px solid #494444; border-bottom: 1px solid #494444" >
                            <b>Query End</b>
                        </td>
                        <td width="10%" style="border-bottom: 1px solid #494444" >
                            <b>Preview Data</b>
                        </td>
                    </tr>

            </HeaderTemplate>

            <ItemTemplate>
                <tr>
                    <td style="border-right: 1px solid #494444;">
                        <asp:Label ID="TblData" runat="server" Text='<%# Eval("table_name") %>'></asp:Label>
                    </td>
                    <td style="border-right: 1px solid #494444;">
                        <asp:Image ID="LoadingImg" runat="server" ImageUrl="~/Stock/Spinner.gif" Visible="False" Height="20px" /><asp:Label ID="LoadingLabel" runat="server" Text='Please Wait...'></asp:Label>
                    </td>
                    <td style="border-right: 1px solid #494444;">
                        <asp:Label ID="lblQuerySart" runat="server" Text=''></asp:Label>
                    </td>
                    <td style="border-right: 1px solid #494444;">
                        <asp:Label ID="lblQueryEnd" runat="server" Text=''></asp:Label>
                    </td>
                    <td>
                        <asp:ImageButton ID="BtnViewData" runat="server" AlternateText="Preview Data..." OnCommand="BtnViewData_Click" CommandArgument='<%# Eval("table_name") %>' CausesValidation="False" BorderStyle="Solid" BorderWidth="1px" ImageAlign="AbsMiddle" Height="20px" ImageUrl="~/Stock/Some.png" Visible="False" Enabled="False" />

                        <ajaxToolkit:modalpopupextender 
                        id="MPE_ShowData" runat="server" 
                        cancelcontrolid="ButtonDeleteCancel" okcontrolid="ButtonDeleleOkay" 
                        targetcontrolid="BtnViewData" popupcontrolid="DivShowData" 
                        backgroundcssclass="ModalPopupBG">
                        </ajaxToolkit:modalpopupextender>


                        <ajaxToolkit:confirmbuttonextender id="CBE_ShowData" 
                        runat="server" targetcontrolid="BtnViewData" enabled="True" 
                        displaymodalpopupid="MPE_ShowData">
                        </ajaxToolkit:confirmbuttonextender>

                    </td>
                </tr>
            </ItemTemplate>
            <FooterTemplate>
                </table>                                              
            </FooterTemplate>
        </asp:Repeater>     
        
        <br>        
        
        </br>

    </ContentTemplate>
</asp:UpdatePanel>

<asp:panel class="popupConfirmation" id="DivShowData" 
    style="display: none" runat="server" ScrollBars="Auto" Height="70%" Width="70%" BackColor="Gray">
    <div class="popup_Container">
        <div class="popup_Titlebar" id="PopupHeader">
            <div class="TitlebarLeft">
                Show The Data</div>
            <div class="TitlebarRight" onclick="$get('ButtonDeleteCancel').click();">
            </div>
        </div>
        <div class="popup_Body">
            <p>
                This is where the data appears!
            </p>
        </div>
        <div class="popup_Buttons">
            <input id="ButtonDeleleOkay" type="button" value="Okay" />
            <input id="ButtonDeleteCancel" type="button" value="Cancel" />
        </div>
    </div>
</asp:panel>