Avoid page refresh using UpdatePanel in ASP.Net

Last Reply one year ago By pandeyism

Posted one year ago

 In my application most of time the pages are getting refersh whn the control fires. for example if i calculate any calculation in textbox, whn i press tab button after refreshing the page my amswers are coming, then whn i click the cutton to invoke calender my page is refreshing, so i dont want to refresh my page all the time. would you refer any code to avoid refreshing?

 

<div>
    PAYMENT<br /><br />
    <table>        
        <tr>
            <td>Consulting Fees : <asp:TextBox ID="txtcon" Width="75" class="btn" runat="server"></asp:TextBox></td>
            <td>Tablet Cost : <asp:TextBox ID="txttab" Width="75" class="btn" AutoPostBack="true" OnTextChanged="txttab_TextChanged" runat="server"></asp:TextBox></td>
            <td>Total Amount : <asp:TextBox ID="txttot" Width="75" class="btn" runat="server"></asp:TextBox></td>
        </tr>
    </table> <br /><br />       
    <table> 
        <tr>
            <td>Payment Mode : <asp:DropDownList ID="pmtmode" AutoPostBack="true" OnSelectedIndexChanged="pmtmode_SelectedIndexChanged" runat="server">
            <asp:ListItem Text="Cash">Cash</asp:ListItem>
            <asp:ListItem Text="Card">Card</asp:ListItem></asp:DropDownList></td>
            <td><asp:Label ID="lblarno" Visible="false" runat="server" Text="ArNo. :"></asp:Label> <asp:TextBox ID="txtarno" Visible="false" Width="100" class="btn" runat="server"></asp:TextBox></td>
            <td>Amount Received : <asp:TextBox ID="txtamtrec" AutoPostBack="true" OnTextChanged="txtamtrec_TextChanged" Width="75" class="btn" runat="server"></asp:TextBox></td>
            <td>Balance Amount : <asp:TextBox ID="txtbalamt" Width="75" class="btn" runat="server"></asp:TextBox></td>
        </tr>
    </table> <br />       
    
</div>

 

 protected void txttab_TextChanged(object sender, EventArgs e)
        {
            txttot.Text = Convert.ToString(Convert.ToInt32(txtcon.Text) + Convert.ToInt32(txttab.Text));
        }

        protected void txtamtrec_TextChanged(object sender, EventArgs e)
        {
            txtbalamt.Text = Convert.ToString(Convert.ToInt32(txttot.Text) - Convert.ToInt32(txtamtrec.Text));
        }

 

<table border="0" cellpadding="1" cellspacing="0" style="margin:0 auto;" align="center" class="tableborder">
  <tr><td>&nbsp;</td> </tr> 
  <tr><td align="center">
   From :<asp:Button ID="btnfrmcal" OnClick="btnfrmcal_Click" runat="server" Text=">>" /><asp:Calendar ID="frmcal" OnSelectionChanged="frmcal_SelectionChanged" Visible="false" runat="server"></asp:Calendar></td>
   <td><asp:TextBox ID="txtfromDate" Width="90px" placeholder="From" name="txtfromDate" class="textboxes" Onfocus ="displayCalendar(this,'mm/dd/yyyy',this)" runat="server" ></asp:TextBox>
   <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="txtfromDate" EnableClientScript="true" ValidationGroup="NeededForValidate" ForeColor="Red" Font-Bold="true" ErrorMessage="*"></asp:RequiredFieldValidator></td>
   <td>To :<asp:Button ID="btntocal" OnClick="btntocal_Click" runat="server" Text=">>" /><asp:Calendar ID="tocal" OnSelectionChanged="tocal_SelectionChanged" Visible="false" runat="server"></asp:Calendar></td>
   <td><asp:TextBox ID="txttoDate" Width="90px" placeholder="ToDate" name="txttoDate" class="textboxes" Onfocus ="displayCalendar(this,'mm/dd/yyyy',this)" runat="server" ></asp:TextBox>
   <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txttoDate" EnableClientScript="true" ValidationGroup="NeededForValidate" ForeColor="Red" Font-Bold="true" ErrorMessage="*"></asp:RequiredFieldValidator></td>
   <td><asp:Button ID="btnfind" runat="server" Font-Bold ="true" Text="Find" ValidationGroup="NeededForValidate" CssClass="btn btn-primary" onclick="btnfind_Click"  /></td>
   </tr>
  <tr><td>&nbsp;</td> </tr> 
 </table>

 

 protected void frmcal_SelectionChanged(object sender, EventArgs e)
        {
            txtfromDate.Text = frmcal.SelectedDate.ToString();
            frmcal.Visible = false;
        }

        protected void tocal_SelectionChanged(object sender, EventArgs e)
        {
            txttoDate.Text = tocal.SelectedDate.ToString();
            tocal.Visible = false;
        }

 

Posted one year ago

Hi sambath,

If you want to avoid page refreshing for that use AJAX UpdatePanel.

Which calender control you are using ?

If you want to use jQuery DatePicker refer below article.

jQuery DatePicker not working inside ASP.Net AJAX UpdatePanel Partial PostBack