Click here to Skip to main content
14,425,223 members
Rate this:
Please Sign up or sign in to vote.
Hey guys, I am stuck with this problem. All I want is to do some mathematical operations among textboxes and display that result in another textbox. Operations include addition, subtraction and % calculation. I started with this code using JavaScript, but could not make it automatically display the calculated result in TextBox1 (result of addition of TotalFeesPaidTextbox and AmountReceivedTextbox) when user put cursor/highlights on TextBox1. Please have a look and help me; I appreciate it.

<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="WebForm7.aspx.cs" Inherits="Application.WebForm7" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script language="javascript" type="text/javascript">

    function sumCalc() {
        var _txt1 = document.getElementById('<%= TotalFeesPaidTextBox.ClientID %>');
        var _txt2 = document.getElementById('<%= AmountReceivedTextbox.ClientID %>');
        var _txt3 = document.getElementById('<%= TextBox1.ClientID %>');
        var t1 = 0, t2 = 0;

        if (_txt1.value != "") t1 = _txt1.value;
        if (_txt2.value != "") t2 = _txt2.value;

        _txt3.value = parseInt(t1) + parseInt(t2);

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<asp:TextBox ID="TotalFeesPaidTextBox" runat="server">
<asp:TextBox ID="AmountReceivedTextbox" runat="server"  onkeyup ="sumCalc" AutoPostBack="True">
<asp:TextBox ID="TextBox1" runat="server">
Updated 14-Aug-12 13:42pm

1 solution

Rate this:
Please Sign up or sign in to vote.

Solution 1

call your javascript function onblur so when cursor leave AmountReceivedTextBox it will call the function.

<asp:textbox id="AmountReceivedTextbox" runat="server" onblur="javascript:sumCalc();" xmlns:asp="#unknown">
Slacker89 15-Aug-12 0:28am
Hey ..Thanks for your solution dude..It worked well. How can I make those textboxes not to accept negative values (like showing some alert)and also how to make that work for decimal values too..(like 12.9+11.1 =24.0). Thanks once again
virang_21 15-Aug-12 0:45am
you can add a regular expression validators on textboxes or just check it in your javascript function call for -ve values. if(t1<0) {alert("total fees cannot be negative."); } . For decimal values change your parseInt to parseFloat()
Slacker89 15-Aug-12 18:01pm
Thanks a lot buddy . It helped a lot. Do you mind answering my small query? I want to have a textbox "LocalMatch Budget" that works based on percentage textbox multiplied to TextBox1. Percentage is another textbox with default value to 30% but it should allow user to change to his own % if user wants. If user dint change that percentage textbox then calculations for LocalMatch textbox should be done like (0.3*TextBox1)or if user changes percentage to some 50% then it should be (0.5*TextBox1). How should I proceed for this ? Appreciate your patience.
Note : Here TextBox1 is the obtained result for my first query
Slacker89 15-Aug-12 18:44pm
hey thanks anywayz. I made it work by using default value and if condition in javascript function for that particular box to be equal to entered value else it takes default value (30%) and does the calculation for me. Thanks buddy.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100