How to stop to reload page when click the button?

Question

I have asp.net website which include some calculation on button. When I press the button, my calculation works fine but, firstly page is refreshing and then the calculation looks on the label. I want to do that calculation looks on the label directly. Without refreshing. I give some codes.

p.s. Also Page_Load has a function that receives daily exchange rates

ASP

<asp:Button ID="Button1" runat="server" BackColor="#990000" 
 BorderColor="#333333" ForeColor="White" onclick="Button1_Click" Text="Calculate" 
 Width="85px" BorderStyle="Outset" style="margin-left: 20px" 
 ValidationGroup="grup1" />

BUTTON CLICK

protected void Button1_Click(object sender, EventArgs e)
{
double sayi1, sayi2, sayi3, hesap, sonuc;

sayi1 = Convert.ToDouble(Tb1.Text);
sayi2 = Convert.ToDouble(Tb2.Text);
sayi3 = Convert.ToDouble(Tb3.Text);


if (Tb1.Text.Contains(".") || Tb2.Text.Contains(".") || Tb3.Text.Contains("."))
{
  ...
  ...
  ...

Answer 1

Use AJAX. If not you will always invoke a postback event. Or on the other hand do some client side programming with JavaScript.

Answer 2

you can use UpdatePanel. to ajaxify. Update panel in Asp.net

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btn" EventName="Click" />
        </Triggers>
        <ContentTemplate>
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <br />
            <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
            <br />
            <asp:Label ID="lblResult" runat="server" />
            <asp:Button ID="btn" runat="server" OnClick="btn_Click" Text="text" />
        </ContentTemplate>
    </asp:UpdatePanel>

on your code behind. // though you need validate all your input, to avoid Format Execption

protected void btn_Click(object sender, EventArgs e)
        {
            int num1, num2, sum;
            TextBox t = (TextBox) UpdatePanel1.FindControl("Textbox1");
            num1 = Convert.ToInt32(t.Text);
            t = (TextBox)UpdatePanel1.FindControl("Textbox2");
            num2 = Convert.ToInt32(t.Text);
            sum = num1 + num2;
            lblResult.Text = sum.ToString();
        }

Answer 3

Create new benchmark or Add rules to a benchmark</h3>
             <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager>
            <asp:updatepanel ID="instuctionsUpdate" runat="server" updatemode="Conditional" >
            <Triggers>
            <asp:AsyncPostBackTrigger ControlID="opener" EventName="click" />
            </Triggers>
            <ContentTemplate>
            <asp:button id="opener" runat="server" Text="Click me for instructions" 
            onClick="opener_click" EnableTheming="False" EnableViewState="False" />

JavaScript

    $("#<%=dialog.ClientID%>").dialog({ autoOpen: false });
        $("#<%=opener.ClientID%>").click(function(){
            $("#<%=dialog.ClientID%>").dialog("open");
        });

Answer 4

Write a WebMethod in your code behind and call WebMethod this from the click function in jQuery.

$(document).ready(function() {
   $("<%= Button1.ClientID%>").click(function() {
     $.ajax({
             type: "POST",
             url: "PageName.aspx/MethodName",
             data: "{}",
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             success: function(msg) {
                // Do something interesting here.
             }
          });
   });
});

In code behind write the webMethod,

public partial class _Default : Page 
{
  [WebMethod]
  public static string MethodName()
  {
    //Your code for calculation goes over here.
  }
}