保持html表单在asp.net按钮上回发

Question

I have an html page, where you click a button and an html form with some fields and a button opens up. The button in the form is an asp:Button with a method in the code behind to handle to click. When I click the button, the page postsback and the form is gone. How can I keep the form from closing on postback? Currently the form is opened through javascript when the html button on the main page is clicked.

I tried putting the form in an update panel, this makes the postback much smoother but still closes the html form.

<asp:Button class="btn btn-success btn-sm"  id="letsTalkVerify"  href="#" onclick="SendSms" runat="server" Text="Send SMS"></asp:Button>

Asp:Button

<form id="letsTalkForm" action="#" runat="server">

html form that needs to stay open on postback

Answer 1

As I understand due to postback your page gone references and the existing data on the page is removed.

If you don't want to lose your data in the same condition I mean postback you've to use UpdatePanel on the page.

An UpdatePanel is a set of components that you want to be affected by ajaxified updates in your webapplication. The triggers are what causes the panel of components to update. If you want to know more about asp.net ajax and update panel please read How Ajax for ASP.NET updatepanels work.

See example:

Before add UpdatePanel on the page you have to add ' ScriptManager ' on the page or master page like:

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

Then after put UpdatePanel tag on the page like:

<asp:UpdatePanel ID="updatePanel3" runat="server">
<ContentTemplate>
</ContentTemplate>
<Triggers>                      
     <asp:AsyncPostBackTrigger ControlID="yourbuttonid" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

NOTE:

1) Your HTML or data which you don't want to lose on button click (postback) but under ContentTemplate with your button. 2) Set your button id under AsyncPostBackTrigger this will handle your request without referencing your page.

Answer 2

You can choose to do it via jquery ajax()

$("#letsTalkVerify").click(function(e){
    e.preventDefault();
    //YOUR CODE VIA AJAX
});