asked on

check the total adds up to 100(not more or less than that)

Hi all,
I have 4 textboxes in a webform where the user enters numerical values that adds up to a total textbox. I have used a javascript that gives me a running total to a total textbox. Here is the problem, the total should be 100 not more or less than that. How would I check to make sure its 100 and if it is more or less, then throw them an error message.

Here is my javascript:
<script language=javascript>
function compute(clid, val1, val2, val3, val4, val5, val6)
{
var entry1 = Number(document.getElementById(val1).value);
var entry2 = Number(document.getElementById(val2).value);
var entry3 = Number(document.getElementById(val3).value);
var entry4 = Number(document.getElementById(val4).value);
var grandtotal = entry1 + entry2 + entry3 + entry4;
var _grandtotal = grandtotal.toFixed(2);
document.getElementById(clid).value = _grandtotal;
}
</script>

http://www.tizag.com/javascriptT/javascriptif.php
+alert

ASKER

So, should I have to have a second javascript to check if the total is 100 or could I add it to the above compute function?

No, why? You can add if and alert.

ASKER

<script language =javascript>
function compute(clid, val1, val2, val3)
{
var grandtotal = 100;
var entry1 = Number(document.getElementById(val1).value);
var entry2 = Number(document.getElementById(val2).value);
var entry3 = Number(document.getElementById(val3).value);
var entry3 = Number(document.getElementById(val3).value);
var grandtotal = entry1 + entry2 + entry3 + entry4;
if (grandtotal != 100)
{
alert("The total should be equal to 100")
}
else
{
document.getElementById(clid).value = grandtotal;
}
}

This is what I did..As soon as I put sth in textbox1, the alert box pops up...any clues..
</script>

I tought you call this function after button "calculate" pressed.

You can check the value only when all fields are not 0.

function compute(e,clid, val1, val2, val3, val4)
{

//get all elements (txtboxes )
var entry1= eval("document.getElementById('"+ val1 +"')");
var entry2= eval("document.getElementById('"+ val2 +"')");
var entry3= eval("document.getElementById('"+ val3 +"')");
var entry4= eval("document.getElementById('"+ val4 +"')");
var total= eval("document.getElementById('"+ clid +"')");

//intialize grandtotal as 0
var grandtotal =0.0 ;

//key press event's key
var key;
key = e.which ? e.which : e.keyCode;

//regex to validate for the numeric value in all text boxes
var pattern=/(^-*\d+$)|(^-*\d+\.\d+$)/
var reEval = new RegExp(pattern);

if(key>=48 && key<=57 ||key==13)
{
//if match failed assign zero else the numeric nalue
var entryval1 = (reEval.test(entry1.value)== false) ? 0 : entry1.value;
var entryval2 = (reEval.test(entry2.value)== false) ? 0 : entry2.value;
var entryval3 = (reEval.test(entry3.value)== false) ? 0 : entry3.value;
var entryval4 = (reEval.test(entry4.value)== false) ? 0 : entry4.value;

grandtotal = entryval1 + entryval2 + entryval3 + entryval4;
total.value = grandtotal.toFixed(2);

if (grandtotal < 100 || grandtotal > 100)
{
// alert("The total should be equal to 100")
//makes the total text border color to red
total.style.borderColor="red";
entry1.focus()
return false;
}

total.style.borderColor="";
return true;
}
else
{
event.keyCode = 0

alert("Please enter number only");
this.submit=false;
return false;
}

}

//cal the above method in keypress event of textbox in codebehind class
string computeControls = textboxTotal.ClientID +","+ textbox1.ClientID +","+ textbox2.ClientID +","+ textbox3.ClientID +","+ textbox4.ClientID ;

this.textbox1.Attributes.Add("onkeypress", "return compute(event,'"+ computeControls +"');");
this.textbox2.Attributes.Add("onkeypress", "return compute(event,'"+ computeControls +"');");
this.textbox3.Attributes.Add("onkeypress", "return compute(event,'"+ computeControls +"');");
this.textbox4.Attributes.Add("onkeypress", "return compute(event,'"+ computeControls +"');");

ASKER

Hi db_110, when you said call the above javascript in keypress event, is there a keypress event in asp.net(C#)? I am calling the javascript in the page_load event but when I debug it, it doesn't let me enter any number. The defualt value for the total textbox is 0.00 with a red border around it.

ASKER CERTIFIED SOLUTION

membership

Create a free account to see this answer

Signing up is free and takes 30 seconds. No credit card required.

ASKER

thanks db_110 for your help. It was great..