View Full Version : Basic displaying of variables in alert

08-10-2005, 10:06 AM
Hi fellas,

Been a long time since ive really touched Javascript, and i've forgotten much of the syntax. That said, I can have a complex piece of code in front of me and explain how it works, but cannot write for peanuts.

I'm basically helping a friend, who had two text fields, which should take numeric values only. This will be the only error checking required. All we need to do is, when the form is processed, multiply the two values entered in each text field, and display the result in an alert box. I also need to get this figure, add 25% to it, and have it multiplied by a figure entered in a third text box, which will also display in the alert box, in the same sentence.

Anyone able to give me some pointers?


08-10-2005, 11:45 AM
Something like this mate?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
/* liorean's toDecimals script (http://www.codingforums.com/member.php?u=5798) */
Number.prototype.toDecimals = function(n) {
n = (isNaN(n)) ? 2 : n;
var nT = Math.pow(10,n);
function pad(s){
s = s || '.';
return (s.length>n) ? s : pad(s+'0');
return (isNaN(this)) ? this : (new String(Math.round(this*nT)/nT)).replace(/(\.\d*)?$/,pad);

function validate(f) {
var num1 = parseFloat(f.txtNumber1.value);
var num2 = parseFloat(f.txtNumber2.value);
var num3 = parseFloat(f.txtNumber3.value);

if(isNaN(num1)) {
alert("Number 1 must be a number");
} else if(isNaN(num2)) {
alert("Number 2 must be a number");
} else if(isNaN(num3)) {
alert("Number 3 must be a number");

var result1 = (num1*num2).toDecimals();
var result2 = ((parseFloat(result1)+(parseFloat(result1)/4))*num3).toDecimals();

alert("Number 1 * Number 2 = "+result2+"\nNumber 1 * Number 2 + 25% * Number 3 = "+result2);

<form name="frm" onsubmit="validate(this); return false;">
<input type="text" name="txtNumber1">&nbsp;Number 1<br>
<input type="text" name="txtNumber2">&nbsp;Number 2<br>
<input type="text" name="txtNumber3">&nbsp;Number 3<br><br>
<input type="submit" value="submit">

Hope this helps


08-10-2005, 12:03 PM
Cheers mate! Thanks a lot for taking the time to do that.

Only this is, it looks a little complicated for the outcome, the code above the main function is *largely* greek to me, and i'll definetly have a hard time getting my bud to understand it! Though I gather I can prune it somehow.

08-10-2005, 03:53 PM
the bit above the Number.prototype.toDecimals is an extension to the standard javascript Number object. The toDecimals method converts the number to the specified number (or two if not specified) of decimal places (with appropriate zeros).

For instance:

var myNumber = 10.123456;
var myRoundedNumber = myNumber.toDecimals(); // returns 10.12

var myNumber = 10.1;
var myRoundedNumber = myNumber.toDecimals(3); // returns 10.100

Here is a simplified version of the function:

/* extend the JavaScript number object with the new method toDecimals */
Number.prototype.toDecimals = function(d) {
/* if no decimal places supplied, round to 2 decimal places */
d = d || 2;

var step1 = this*Math.pow(10, d); // multiply number (referred to as this) by 10 to the power of the number of decimal places required
var step2 = Math.round(step1); // round that result
var step3 = step2 / Math.pow(10, d) // divide the rounded number by 10 to the power of the number of decimal places required

return step3; // return the rounded number

There's plenty of tutorials on the web explaining the maths behind rounding numbers in greater detail, I just hope i've given you some initial insight into it.

Hope this helps


08-10-2005, 04:12 PM
Champ! Thanks for your time.