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

问题

I have a small application as below.

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>

回答1:

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>

回答2:

This is your problem :

You are using multiple update Panels. And Trying to Trigger a textbox that's not in the updatepanel. Trigger finds the control inside the update panel and than gives a postback. But your txtMQty is not inside the update panel. So trigger won't work.

If you use single update panels your issue will be resolved. Please check my code given below. This will work for you.

<asp:updatepanel id="UpdatePanel1" runat="server">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="txtMQty" EventName="TextChanged" />
    </Triggers>
    <ContentTemplate>
        Material Quantity
        <asp:TextBox ID="TextBox1" runat="server" Width="87px" AutoPostBack="True" OnTextChanged="txtMQty_TextChanged"></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ForeColor="Red" Display="Dynamic" ControlToValidate="txtMQty" ErrorMessage="Please provide Material Quantity" ValidationGroup="CreateVal"></asp:RequiredFieldValidator>
        <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ForeColor="Red" Display="Dynamic" ControlToValidate="txtMQty" ErrorMessage="Please provide proper Quantity in number format" ValidationExpression="^\d+$" ValidationGroup="CreateVal"></asp:RegularExpressionValidator>
        <br />
        <br />
        Material Rate
        <asp:TextBox ID="TextBox2" runat="server" Width="87px" ReadOnly="True" >5</asp:TextBox>
        <br />
        <br />
        PO Total
        <asp:TextBox ID="TextBox3" runat="server" Width="87px" ReadOnly="True"></asp:TextBox>
    </ContentTemplate>
</asp:updatepanel>

This is a working html designer.

来源：https://stackoverflow.com/questions/23844725/calculate-total-on-textboxs-textchanged-event-in-asp-net

标签

ASP.NET

updatepanel

autopostback