0

I have a php site that has text boxes in a form. I want to be able to type in the text box "=4*6" or "=5/12*30" with out the quotes and have it calculate the formula in the box. I know how to call a onchange on the text box to a javascirpt function but I am unsure how to have it read the formula. I have googled math for javascript and php and i have not found anything other than predetermined numbers and equation symbols. Any Help Appreciated.

Thank You

varcor
  • 63
  • 1
  • 2
  • 10
  • possible duplicate of [Safe evaluation of arithmetic expressions in Javascript](http://stackoverflow.com/questions/5066824/safe-evaluation-of-arithmetic-expressions-in-javascript) – Justin808 Oct 01 '14 at 17:06
  • I tried that and it didn't work. I downloaded the parser.js included it. I have : – varcor Oct 01 '14 at 17:18
  • Seems to work just fine. http://jsbin.com/visagomoweve/1/edit "2 * (3 + 4)" is 14. A) 3 + 4 = 7. B) 2 * 7 = 14. – Justin808 Oct 01 '14 at 23:27

2 Answers2

1

I started to work on this idea:

http://jsbin.com/sebeke/1/edit

I was borrowing the seconds part of the idea from this answer: split a mathematical expression on operators in Javascript

I think once you had an array of the numbers and operators, like in the examples, you might be able to build an order of operations (Remeber please excuse my dear aunt sally..) type of switch case function, that would recursively loop through the array, looking first for the action to preform, and then perform the actions on the surrounding numbers to your array.

sudo code would be:

if (arrayValues[i]) == '*'{
 arrayValues[i-1] * arrayValues[i+1];
 arraryvalues[i-1] = results;
 //then pop off the next two items in the array.
//Then go back through the array
}

This was my first idea regarding this.

Community
  • 1
  • 1
tbh__
  • 324
  • 3
  • 17
  • This is the correct logic to solving the problem. The answer @Kpym is not. Even so, why re-create the wheel? – Justin808 Oct 01 '14 at 23:34
  • You make a good point, if there is a safe library out there already doing this I'd recommend using it. Angular is pretty heavy to include just for this operation if you are not already using it. Here is my suggestion a little more fleshed out: http://jsbin.com/sebeke/7/edit it would do the simple version of what was asked. – tbh__ Oct 02 '14 at 01:27
-1

For simple calculations you can do it realy easy with AngularJS using $eval(). In your input field add ng-model="formula" and then display the result with {{$eval(formula.substring(1))}}.

Here is an example code: 

<label>Type formula:</label>
<input type="text" ng-model="formula" placeholder="=1+1">
<h1>result: {{$eval(formula.substring(1))}}</h1>

You can check it in action here : enter link description here

If you want to use plain JavaScript you ca do it by using eval(). If the value of your input is in variable formula starting with = sign, the result can be obtained by eval(formula.substring(1)), but note that the standard eval() is less secure than angular's $eval().

Kpym
  • 3,743
  • 1
  • 21
  • 18
  • Is there a way from that framework to have the result in the same textbox? and have it caculate from onchange()? That looks good – varcor Oct 01 '14 at 17:56
  • @varcor Here is a working example : [http://jsfiddle.net/7xj5vqk0/](http://jsfiddle.net/7xj5vqk0/). But you can't use `ng-change` because it fires on every new caracter (like keypress). So I use `ng-blur` and `ng-keydown` to simulate it. – Kpym Oct 01 '14 at 18:54
  • @varcor - Dont use $eval !!! Its a nice security hole in your app. The user has direct access to everything on your scope, including functions.The pure javascript eval is even worse. – Justin808 Oct 01 '14 at 23:30
  • @Justin808 If you use isolated scope (in directive) there is nothing else in the scope, and no 'security hole' ! So dont downgrade this answer for this, please, just show to varcor how to use isolated scope if you want. By the way you have always acces to all javascript objects (and so all scopes) by using the console, so what you call 'security hole' is available on all web pages ! – Kpym Oct 02 '14 at 06:45