Jump to content

calculating the total value of numbers in a textarea


Tusk
 Share

Recommended Posts

I have some code that gives me the sum of numbers in a textarea (see below), but it only works on the first line.1) If there are more then one spaces between numbers it gives an error 2) If there is a space before the first number it also gives an error3) It only adds up the numbers on the first lineI basically want it to give me the sum of all numbers in the textarea irrespective of spaces between them or lines separating them.Any help will be appreciated </html><head><meta http-equiv='Content-type' content='text/html;charset=UTF-8'><title>Calc Numbers</title><script type='text/javascript'>function calc() {// calc() is designed to sum numbers entered in an input fieldvar t = document.getElementById("num").value; // the numbers enteredvar numbers = new Array();numbers = t.split(' '); // the numbers extracted from the stringvar sum = 0; // variable to hold the sum of the numbersvar num = ''; // string to hold a list of the numbersif (numbers.length == 1) { num = '0'; } // to add single number tofor (i = 0; i < numbers.length; i++) {sum = sum + eval(numbers); // add this numberif (i == numbers.length - 1) { num = num + " and ";} // last number?else { if (i > 0) { num = num + ", "} } // otherwise if not 1st, join with ,num = num + numbers; // and add the number to the list}// create the text to display with the resultresult = "<p>The sum of the numbers " + num + " is " + sum +"<"+"/p>";// find the placeholder for displaying the resultvar resElement = document.getElementById("res");// display the resultresElement.innerHTML = result;}</script></head><body><h1>Calc Numbers</h1><p>Enter some numbers separated by spaces:</p><textarea id='num' onclick="this.value=''" onchange='calc()' cols = 65 rows = 5 wrap="PHYSICAL"></textarea><!-- provide a dummy button - encourage user to leave input tag --><input type="button" value="Calc"><!-- the following div id='res' provides a placeholderthat calc() can use to display the result --><div id='res'></div></body></html>

Link to comment
Share on other sites

Thanks DD,It has solved the problem of the spaces, but have encounted another problem in the result, for some reason my function is not recognizing double digit numbers it converts them to single digits e.g "23 4 55" it converts to "2+3+4+5+5=19" and not "23+4+55=82"<head><script type="text/javascript" src="https://getfirebug.com/firebug-lite-debug.js"></script><meta http-equiv='Content-type' content='text/html;charset=UTF-8'><title>Calc Numbers</title><script type='text/javascript'>function calc() {// calc() is designed to sum numbers entered in an input fieldvar t = document.getElementById("num").value; // the numbers enteredvar numbers = new Array();numbers = t.split(/\s*/); // the numbers extracted from the stringvar sum = 0; // variable to hold the sum of the numbersvar num = ''; // string to hold a list of the numbersif (numbers.length == 1) { num = '0'; } // to add single number tofor (i = 0; i < numbers.length; i++) {sum = sum + eval(numbers); // add this numberif (i == numbers.length - 1) { num = num + " and ";} // last number?else { if (i > 0) { num = num + ", "} } // otherwise if not 1st, join with ,num = num + numbers; // and add the number to the list}// create the text to display with the resultresult = "<p>The sum of the numbers " + num + " is " + sum +"<"+"/p>";// find the placeholder for displaying the resultvar resElement = document.getElementById("res");// display the resultresElement.innerHTML = result;}</script></head><body><h1>Calc Numbers</h1><p>Enter some numbers separated by spaces:</p><textarea id='num' onclick="this.value=''" onchange='calc()' cols = 65 rows = 5 wrap="PHYSICAL"></textarea><!-- provide a dummy button - encourage user to leave input tag --><input type="button" value="Calc"><!-- the following div id='res' provides a placeholderthat calc() can use to display the result --><div id='res'></div></body>

Link to comment
Share on other sites

Thanks for help I am almost there but stuck at the last hurdle, in the input field you can enter spaces any where and any amount of spaces between the numbers and the result returns a list of the numbers with a single space separating them which is great :) I now just want to calculate the sum of the result ?? have spent hours trying to do this but cant get scrip or figure out how to do it, will be most great full if some body can do this for me Many thanks<head><script type="text/javascript" src="https://getfirebug.com/firebug-lite-debug.js"></script><meta http-equiv='Content-type' content='text/html;charset=UTF-8'><title>Calc Numbers</title><script type='text/javascript'>function calc() {// calc() is designed to sum numbers entered in an input fieldvar t = document.getElementById("num").value; // the numbers enteredvar numbers = new Array();numbers = t.split(" "); // the numbers extracted from the stringvar sum = 0; // variable to hold the sum of the numbersvar num = ''; // string to hold a list of the numbersif (numbers.length == 1) { num = '0'; } // to add single number tofor (i = 0; i < numbers.length; i++) {sum = sum + eval(numbers); // add this numberif (i == numbers.length - 1) { num = num + " ";} // last number?else { if (i > 0) { num = num + " "} } // otherwise if not 1st, join with ,num = num + numbers; // and add the number to the list}// create the text to display with the resultresult = num +"<"+"/p>";// find the placeholder for displaying the resultvar resElement = document.getElementById("res");// display the resultresElement.innerHTML = result;}</script></head><body><h1>Calc Numbers</h1><p>Enter some numbers separated by spaces:</p><textarea id='num' onclick="this.value=''" onchange='calc()' cols = 65 rows = 5 wrap="PHYSICAL"></textarea><!-- provide a dummy button - encourage user to leave input tag --><input type="button" value="Calc"><!-- the following div id='res' provides a placeholderthat calc() can use to display the result --><div id='res'></div></body>

Edited by Tusk
Link to comment
Share on other sites

try something like thisfunction calc() {// calc() is designed to sum numbers entered in an input fieldvar t = document.getElementById("num").value; // the numbers enteredvar numbers = new Array();numbers = t.split(" "); // the numbers extracted from the stringvar sum = 0; // variable to hold the sum of the numbersvar num = ''; // string to hold a list of the numbersif (numbers.length == 1) { num = '0'; } // to add single number tofor (i = 0; i < numbers.length; i++) {sum = sum + eval(numbers); // add this number//if (i == numbers.length - 1) { num = num + "=";} // last number?//else { if (i > 0) { num = num + " + "} } // otherwise if not 1st, join with ,//num = num + numbers; // and add the number to the list//}// create the text to display with the resultif (numbers.length==1){num = numbers;}else if(i != numbers.length-1){num = num + numbers + " + ";}else{num = num + numbers +" = "+sum;}}result = num;// find the placeholder for displaying the resultvar resElement = document.getElementById("res");// display the resultresElement.innerHTML = result;}

Edited by dsonesuk
Link to comment
Share on other sites

  • 2 weeks later...

Hi DD, there are a few versions of the post so have cleaned up the one I am using and show it below. In the textarea I can have multiple spaces or CR between numbers and it works giving me their sum :) But if i have a space before the first number or after the last number I get a NAN :) <html> <head> <title>Calc Numbers</title><script type='text/javascript'>function calc() {var t = document.getElementById("digit").value;var numbers = new Array();numbers = t.split(/\s+/);var sum = 0;var num = '';if (numbers.length == 1) { num = '0'; }for (i = 0; i < numbers.length; i++) {sum = sum + eval(numbers); if (i == numbers.length - 1) { num = num + " and ";} else { if (i > 0) { num = num + ", "} } num = num + numbers; }result = + sum +"<"+"/p>";var resElement = document.getElementById("res");resElement.innerHTML = result;}</script></head> <form> <textarea id='digit' onclick="this.value=''" onchange='calc()'cols = 65 rows = 5 ></textarea><br>  <input type="button" name="b1" value="Click" onClick = "calc()"> <span><div id='res'></div></span> </form> </html>

Link to comment
Share on other sites

I can get it to work by replacing eval in this line:sum = sum + eval(numbers);with Number:sum = sum + Number(numbers);eval has very limited uses and this is not one of them. You should be using casting techniques such as Number() or parseInt(). The reason you get NaN is because your trying to eval a blank string ("") and I'm not sure what the return value of that is but it's not a number, so any calculation done with it will return NaN.

Edited by ShadowMage
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...