UpdatePanel 外的按钮

Question

这是我遇到问题的完整代码。

单击 but_OK 按钮后，UpdateProgress 面板不会显示。但是，如果我将“dmgConfirm”DIV 放在 UpdatePanel 、 UpdateProgress 面板中。如何使 UpdateProgress 面板显示将 But_OK 保持在 UpdatePanel 之外？

<%@ Page Title="Test Jquery" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="TestJquery.aspx.cs" Inherits="EluxDamageClaims.TestJquery"  %>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">

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

 <asp:UpdateProgress ID="updProgress"
    AssociatedUpdatePanelID="UpdatePanel1"
    runat="server">
        <ProgressTemplate>           

    <div class ="divProgressBarBack" >
    </div>
      <div class ="divProgressBar">
           <img alt="progress" src="images/ajax_loading.gif"/>
           <h1> Processing...  </h1>
    </div>      
        </ProgressTemplate>
    </asp:UpdateProgress>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate >


        <asp:Button Text="Make Visible" ID ="btnMakeVisible" runat="server" OnClick="btnMakeVisible_Click" />
        <asp:Panel runat="server" ID="pnl" Visible ="false" >

对话框

<!-- ui-dialog -->

Lorem ipsum dolor sit amet，consectetur adipisicing elit，sed do eiusmod tempor incididunt ut labore et dolore magna aliqua。 Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat。

 <input id="hbtnConfirm" type="button" value="Submit" onclick="openModalDiv('dmgConfirm');" />


            </asp:Panel>

 <div id="dmgConfirm" title="Damage Claim Confirm " >
        <b> Please confirm your submission ?. You cannot undo this operation.</b><br /><br />

       <table>
           <tr> <td><asp:Button ID="but_OK"  runat="server" Text="Confirm" OnClick="but_OK_Click"  />   </td>
               <td> <input id="Button2" type="button" value="Cancel" onclick="javascript: closeModalDiv('dmgConfirm');" /></td>
           </tr>
       </table>
    <br />
     </div> 
</asp:Content> 

Answer 1

您将不得不提及按钮的触发器 - 让它甚至位于页面中的任何位置 - 它仍然会触发 UpdteProgress 面板内容。

<asp:UpdatePanel>
........
........
<Triggers> <asp:AsyncPostBackTrigger ControlID="but_OK" EventName="Click" /> 
</Triggers> 
</asp:UpdatePanel>

Answer 2

发布工作代码 FYR（点击“确认”）

ASPX：

 <asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
    <asp:UpdateProgress ID="updProgress"
        AssociatedUpdatePanelID="UpdatePanel1" 
        runat="server">
        <ProgressTemplate>
            <div class="divProgressBarBack">
            </div>
            <div class="divProgressBar">
                //<img alt="progress" src="images/ajax_loading.gif" />
                <h1>Processing...  </h1>
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
        <ContentTemplate>


            <asp:Button Text="Make Visible" ID="btnMakeVisible" runat="server"  />
            <asp:Panel runat="server" ID="pnl" Visible="false">
                <input id="hbtnConfirm" type="button" value="Submit onclick="openModalDiv('dmgConfirm');" />


            </asp:Panel>
            <div id="dmgConfirm" title="Damage Claim Confirm ">
                <b>Please confirm your submission ?. You cannot undo this operation.</b><br />
                <br />

                <table>
                    <tr>
                        <td>

                        </td>
                        <td>
                            <input id="Button2" type="button" value="Cancel" onclick="javascript: closeModalDiv('dmgConfirm');" /></td>
                    </tr>
                </table>
                <br />
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
<asp:Button ID="but_OK" runat="server" Text="Confirm" OnClick="but_OK_Click"  />
</asp:Content>

代码背后：

    protected void but_OK_Click(object sender, EventArgs e)
    {
        UpdatePanel1.Update();

    }