UpdatePanel is causing full (rather than partial) PostBack

Question

I used an UpdatePanel to prevent the whole page from reloading when I click on the button.

I did my code well, and I tried to prevent the page from loading when I click the button, but the page reloads again regardless. How can I solve this problem?

<asp:UpdatePanel ID="dd" runat="server">
<ContentTemplate>
<asp:Panel ID="PostPanel" Style="display: none" runat="server">
    <div class="modalPopup">
        <div class="PopupBody">
            <p class="ads-text">
                Go </p>
        </div>
        <div class="Controls">
            <div class="post">
                <asp:Button Text="OK" runat="server" ID="btnOkay" ValidationGroup="AddUserpopup"
                    OnClick="btnOkay_Click" />
            </div>
        </div>
    </div>
</asp:Panel>
 </ContentTemplate>
 <Triggers>
 <asp:AsyncPostBackTrigger  ControlID="btnOkay" EventName="CLick"/>
 </Triggers>
 </asp:UpdatePanel>

Answer 1

Try this. You need to set the UpdateMode and ChildrenAsTriggers properties. Also, your event name had incorrect capitalization.

<asp:UpdatePanel ID="dd" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
<ContentTemplate>
<asp:Panel ID="PostPanel" Style="display: none" runat="server">
    <div class="modalPopup">
        <div class="PopupBody">
            <p class="ads-text">
                Go </p>
        </div>
        <div class="Controls">
            <div class="post">
                <asp:Button Text="OK" runat="server" ID="btnOkay" ValidationGroup="AddUserpopup"
                    OnClick="btnOkay_Click" />
            </div>
        </div>
    </div>
</asp:Panel>
 </ContentTemplate>
 <Triggers>
 <asp:AsyncPostBackTrigger  ControlID="btnOkay" EventName="Click"/>
 </Triggers>
 </asp:UpdatePanel>