Search code examples
c#asp.netupdatepanelautopostback

Calculate total on TextBox's TextChanged() event in asp.Net


I have a small application as below.

Screenshot

In this Material Rate and PO Total are read only fields. I want to calculate the total as per material quantity changes by formula (Total=Rate*Qty).

I coded on Material Quantity's TextChanged() and also changed AuotoPostBack to True

Code I tried is as below:

protected void txtMQty_TextChanged(object sender, EventArgs e)
{
 checkTotal();
}

//I am saving Rate in ViewState["Rate"] and retrieving here.
private void checkTotal()
{
 Rate = Convert.ToInt32(ViewState["Rate"]);
 txtMQty.Text = string.Empty;
 if (Rate > 0 && txtMQty.Text == string.Empty)
 {
  txtMRate.Text = Rate.ToString();
  txtTotal.Text = Rate.ToString();
 }
 Regex reg = new Regex("[^0-9]+$");
 var str = txtMQty.Text.ToString();
 str = reg.Replace(str, string.Empty);
 if (str.Length > 0)
 {
 var qty = Convert.ToInt32(txtMQty.Text.ToString());
 int total = (Rate* qty);
 txtTotal.Text = total.ToString();
 }
 }

I am also using UpdatePanel to avoid round trip. My problem is when I input Quantity txtMQty's TextChaged() event should fire but it's not firing. Not getting what's wrong.

my .aspx page is as below.

<tr>
        <td class="auto-style3">
            Material Quantity</td>
        <td class="auto-style4">
            <asp:TextBox ID="txtMQty" runat="server" Width="87px" AutoPostBack="True" OnTextChanged="txtMQty_TextChanged"></asp:TextBox></td>
        <td>
            <asp:RequiredFieldValidator ID="RFVMQty" runat="server" ForeColor="Red" Display="Dynamic" ControlToValidate="txtMQty" ErrorMessage="Please provide Material Quantity" ValidationGroup="CreateVal"></asp:RequiredFieldValidator>
            <asp:RegularExpressionValidator ID="REVMQty" runat="server" ForeColor="Red" Display="Dynamic" ControlToValidate="txtMQty" ErrorMessage="Please provide proper Quantity in number format" ValidationExpression="^\d+$" ValidationGroup="CreateVal"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
 <tr>
        <td class="auto-style3">Material Rate</td>
        <td class="auto-style4">
            <asp:UpdatePanel ID="UpdateRate" runat="server">
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="txtMQty" EventName="TextChanged" />
                </Triggers>
                <ContentTemplate>
            <asp:TextBox ID="txtMRate" runat="server" Width="87px" ReadOnly="True"></asp:TextBox>
                    </ContentTemplate>
        </asp:UpdatePanel>
                    </td>
        <td></td>
    </tr>
    <tr>
        <td>
            PO Total
        </td>
        <td class="auto-style4">
            <asp:UpdatePanel ID="UpdateTotal" runat="server">
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="txtMQty" EventName="TextChanged" />
                </Triggers>
                <ContentTemplate>
            <asp:TextBox ID="txtTotal" runat="server" Width="87px" ReadOnly="True"></asp:TextBox>
                    </ContentTemplate>
        </asp:UpdatePanel>
        </td>
    </tr>
    <tr>

Solution

  • You need to enable AutoPostBack on the textbox that results in the event.

    <asp:TextBox ID="txtMQty" runat="server" AutoPostBack="True"></asp:TextBox> 
    

    EDIT:
    Sorry You also need to assign the event:

    <asp:TextBox ID="txtMQty" runat="server" AutoPostBack="True" OnTextChanged="TextBox1_TextChanged"></asp:TextBox>