how can I click on button inside div to not to refresh whole page asp.net C#

Question

"I have 3 buttons on click of the button using java script the div will appear each div have different button to save some data in asp.net page but it refresh whole page i would like to refresh particular div only and save data to my db"

Button Code

<asp:Button ID="btnConse" runat="server" CssClass="Button" AlternateText="1" Text="Consequence" 
    OnClientClick="ToggleDiv('Consequence');return false;" />
<asp:Button ID="btnTask" runat="server" CssClass="Button" AlternateText="1" Text="Task" 
    OnClientClick="ToggleDiv('Task');return false;" />

<asp:Button ID="Button4" runat="server" CssClass="Button" AlternateText="1" Text="Incident" 
    OnClientClick="ToggleDiv('Incident');return false;" />

Java script

<script type="text/javascript">
    function ToggleDiv(Flag) {
        if (Flag == "Consequence") {
            document.getElementById('divConsequence').style.display = 'block';
            document.getElementById('divTask').style.display = 'none';
            document.getElementById('divIncident').style.display = 'none';
        }
        else {
            if (Flag == "Task") {
                document.getElementById('divConsequence').style.display = 'none';
                document.getElementById('divTask').style.display = 'block';
                document.getElementById('divIncident').style.display = 'none';
            }
            else {
                if (Flag == "Incident") {
                    document.getElementById('divConsequence').style.display = 'none';
                    document.getElementById('divTask').style.display = 'none';
                    document.getElementById('divIncident').style.display = 'block';
                }
            }
        }
    }
</script>

Div

<div id="divConsequence" style="display: none;">
    <div class="TabTextHoriCenter">
        <asp:Label ID="Label28" runat="server" Text="div Consequence"></asp:Label>
        <asp:Button ID="btnSaveCon" runat="server" CssClass="Button" AlternateText="1" Text="Consequence" OnClick="btnSaveCon_Click"  />
    </div>
</div>
<div id="divTask" style="display: none;">
    <div class="TabTextHoriCenter">
        <asp:Label ID="Label33" runat="server" Text="div Task"></asp:Label>
        <asp:Button ID="btnSaveTask" runat="server" CssClass="Button" AlternateText="1" Text="Task" OnClick="btnSaveTask_Click"  />
    </div>
</div>
<div id="divIncident" style="display: none;">
    <div class="TabTextHoriCenter">
        <asp:Label ID="Label34" runat="server" Text="div incident"></asp:Label>
        <asp:Button ID="btnSaveInc" runat="server" CssClass="Button" AlternateText="1" Text="Incident" OnClick="btnSaveInc_Click"  />
    </div>
</div>

in this div there are button which performs server operation

How can I refresh only this div not the whole page?

.cs code

   protected void btnAddFiles_Click(object sender, EventArgs e)
{
    if (fuFile.HasFile)
    {
        FileUpload Custom = new FileUpload();
        Custom = fuFile;
        if (Session["FileUpload"] != null)
        {
            FileUpload[] fuu = (FileUpload[])Session["FileUpload"];
            int cnt = 0;
            for (int k = 0; k < fuu.Length; k++)
            {
                if (fuu[k] != null)
                {
                    cnt++;
                }
                else
                {
                    break;
                }
            }
            fuu[cnt] = Custom;
            Session["FileUpload"] = fuu;
        }
        else
        {
            FileUpload[] fuu = new FileUpload[100];
            fuu[0] = Custom;
            Session["FileUpload"] = fuu;
        }
        if (flag == 1)
        {
            FilesAttached.Value = "";
            flag = 0;
        }

        FileInfo Finfo = new FileInfo(fuFile.PostedFile.FileName);

        string Ext = Finfo.Extension.ToLower();
        string f = fuFile.FileName.ToLower();
        string fname = Session["CompanyID"].ToString() + Session["MyRiskArea"].ToString();

        Session["time"] = String.Format(Global.yyyy_mmm_ddhh_mm_ss_tt.ToString(), DateTime.Now);
        int i = Convert.ToInt32(Ext.Length);
        String NewString = f.Remove(f.Length - i, i) + Session["time"].ToString();
        string str = NewString + Ext;
        fuFile.SaveAs(Server.MapPath(Global.AttachedFiles + "/" + str));
        ht.Add(Session["time"].ToString(), f);
        ht1.Add(Session["time"].ToString(), System.IO.Path.GetFullPath(fuFile.FileContent.ToString()));

        dlIncidents.DataSource = ht;
        dlIncidents.DataBind();
        fuFile.Focus();
        dlIncidents.Visible = true;
        //BindGrid();
    }
}

Answer 1

Have You tried using Ajax Update Panel With Script Manager. Put all the div Contents into Update Panel and try it. It Should Work

Answer 2

For submitting some portion of the web page to the server,Ajax is the best way.

"AJAX " avoids complete page submisson.For more information see the below links... http://www.indiabix.com/technical/dotnet/asp-dot-net-ajax/

http://www.w3schools.com/ajax/ajax_intro.asp

http://www.tutorialspoint.com/asp.net/asp.net_ajax_control.htm

Answer 3

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
   <ContentTemplate>
      <div>
          <input type="submit" value="Continue" runat="server" />
      <div>
   </ContentTemplate>
</asp:UpdatePanel>

The "updatepanel" will make sure that the data is submitted with out refreshing the entire page.