-
I am creating a math wuiz to show the output I have used slideshow which is displaying numbers in that particular expression one by one with answer , Everything is working properly for me ,
-
Now I have created a small block at bottom right corner in output window named "total " , like this
<div class="total"> Total: <input id='total' type="text" name="calculate" placeholder="Total ..."/></div> -
My aim is to in this block I want to show real time calculation of expression which is currently displaying in the slideshow
-
the expression is generating randomly because I have used rand() function and storing it in an array like this
// generate expressions using the specified random seed srand($seed); $expressions = array(); for ($i = 1; $i <= $num_questions; $i++) { $expression = generate_expression($num_operands, $operations, $num_digits); $expression_string = implode(" ", $expression); $result = eval("return ($expression_string);"); $expressions[] = compact("expression", "result"); } -
the reason I used for loop here is because there can be many questions based on input given by user through form ,so every question is generating one by one in slideshow
-
in $expressions array many expressions or questions are stored along with answer,upto this everything is working fine
How Is it possible to show the real time calculation in javascript using this ?
I think that you will need to provide further details about your requirements.
For example: You have a PHP array, containing math expressions that will be used in a math quiz slideshow/timer thing.
<php
$expressions = array(
array("2 + 4 / 5 * 5", "5"),
array("17 - 2 * 4", "9")
);
?>
Yes I know that your PHP code generates the expressions in a different way, but the above is a simplification that can help us to focus on what’s important - the JavaScript side of things.
You want to use JavaScript to show the expressions, and to show the real time calculation.
Question: What do you mean by real time calculation?
- Do you want “2 + 3 / 5 * 5” to be replaced by the answer of “5”?
- Or, do you want “2 + 3 / 5 * 5” to have an equals sign added to it with the answer? " = 5"
- Or. do you want “2 + 3 / 5 * 5” to show the BODMAS steps of solving the equation?
Thanks for the reply , I am answering to the questions below
-
what I ment by real time calculation is for example I 've got an expression like “2 + 3 / 5 * 5” then already this expression is displaying in slideshow in the manner of ony by one items at a time.
-
In addition to this I also want to show the above expression in a total block that I have creted lin the manner lke
- firstly 2 will display in that block as wll as in a slideshow
- then when +3 is displayed in slideshow at same time in the block named total +3 should get added to previous element i.e 2 and will show the total 5
- like this after +3 , /5 will display in slideshow and in block 1 should display (as 5/5 = 1) and so on . -
This is real time calculation I want to show
-
I don’t want to show = sign
I tried to show it with known values and it was working but as here its already geting sored in an array I am getting confused
But isn’t the total calculated in a way that’s different from just left to right?
The following “6 / 2(1 + 2)” formula helps to demonstrate the difference.
An incorrect answer is found by doing 6/2, then multiplying by 1+2
The correct answer is found by resolving the parenthesis first
6 / 2 * 3
Then applying the multiplication and divisions from left to right:
3 * 3
Until you get to the answer
9
All in all the steps are:
- 6 / 2(1 + 2)
- 6 / 2(3)
- 6 / 2 * 3
- 3 * 3
- 9
That seems to be a different process from the “after +3 , /5 will display in slideshow” that you were mentioning.
If you have something different in mind, can you please provide further clarification?
By the way, there is a useful “step by step” formula solver that you might find useful, at https://github.com/j0hnskot/calculate.js/tree/master
-
basically in the bloc named “total” I want to show only one number and that number will be calculation of current number displaying in slideshow and the pevious number
-
for ex 1 +2 *3 is expression then firstly only 1 will display in block and after 1 when +2 is displaying in slideshow at the same time +2 will get append to previous element i.e 1 and will show result 3 in that block , this process will continues untill last element of expression
-Note - there is no operator preference -
can I provide the code which I have created but this code is for only 4 numbers ?
Okay, I’ll stop developing an operator preference solution then.
Won’t people be highly confused when 1+2*3 is shown to be 9 when the correct answer really is 7?
I am feeling highly emotionally charged by this separation from operator preference.
If you carry on down that path of ignoring operator precedence, then someone else with a stronger stomach than my own will need to step in to move forward with helping you towards your solution.
yeah Technically its confusing but its like abacus thing and follows First come first serve formulae
- because here I am using rand function its not in anyone’'s control that what will be numbers and operations and final answer
here is the code of how I am displayiing the expression one by one ina slideshow
<div class="slide" id="out">
<div class="head">Q(<?php echo $index+1.?>).</div><br>
<div class="expression flex flex-row" id="exp">
<?php
$iCount = count($expression);
foreach($expression as $key => $item) { ?>
<span class="slide-item" id="visible"><center> <?php
//logic 1 for operand and operator togather
if($item == "*")
{
echo "x".$expression[$key+1];;
}
elseif($key == 0 && $key < $iCount -1)
{
echo $item;
}
elseif($key % 2 !== 0)
{
echo $item.$expression[$key+1];
//$key++;
}
else
{
//
}
?></span><!--displaying each item at a time-->
<?php } ?></div>
I know its not a proper way but what should I do now , its because I am using eval() function
but I can’t chnange the core logic now it will be complecated . Please guide me through the real time calculation isuue
can I provide the logic I have used to generate thhe expression with rand function ?
Sorry no, not from me. I’ve been down this road many time before when people do things the Wrong Way™ and I just can’t face myself the next morning.
Someone else will be needed to guide you through the way that you want to do things.
I’m not aware of such, got a link? AFAIK multiplication and division before addition and subtraction are pretty much de facto.
I have a feeling you want it to be so primarily because doing it the proper way would be more complex.
Note that precedence rules can be “avoided” by using parentheses. eg.
1 + 2 * 3 = 7
(1 + 2) * 3 = 9
If you really must have things “in order” you should be able to code in parentheses where appropriate.
I will definitely fix this , I 've got an idea from above post of using parenthesis but please do tell me how to get the expression from $expression and display the real time calculation that I have explained
hey @ Paul_Wilkins , @ Mittineague
I hve teted my code once again and I calculated the expression manually which is displying currently and its showing answer in a correct way with operator preference ,
seriously I personally never checked it in that way manually because I have not included seperate code for operator preference , but now when I checked it its correctly evaluating the expression Thans for showing the correct way I will remember this from next time that it should be in proper preference
A few rare formulas will evaluate correctly with and without operator preference.
That’s why I like to use 6 + 2 * 3 as you can clearly recognise good evaluation from bad.
With correct evaluation you get:
6 + 2 * 3 => 6 + 6 => 12
With sequential evaluation you get:
6 + 2 * 3 => 8 * 3 => 24
One of those answers is correct, and the other is not. Using the correct evaluation order matters.
yes exactly , I have calculated it manually whatever expression isdisplaying and eventually my code is showing it correctly like this 6 + 2 * 3 => 6 + 6 => 12
now I have only one issue and that is real time calculation I am still trying but its not working somehow
Yes, eventually it will because JavaScript knows about operator precedence too.
The problem that I have is with the steps that your planned program instructs the students to take.
6 + 2 * 3 being solved by:
- 6 = 6
- 6 + 2 = 8
- 6 + 2 * 3 = 12
That is not how things should be done, it is not how math should be taught, and you will damage students that try to learn math using that sequential technique.
I now need a break before I damage something around me.
I’m having some trouble thinking of a good way to do this. My understanding is the process is basically a series of “using that result, now do this” steps?
One way might be to actually use the result eg.
6 + 2 = 8
8 * 3 = 24
But if the numbers and operators are pulled from arrays, I can’t think of a way other than parentheses, which could get messy looking, depending, eg.
6 + 2 = 8
(6 + 2) * 3 = 24
((6 + 2) * 3) - 4 = 20
(((6 + 2) * 3) - 4) / 2 = 10
In case this helps someone out, I’ve put together some sample code.
This sample code automatically generates steps for solving equations, using the following libraries:
- calculate: https://github.com/j0hnskot/calculate.js which requires
- js-expression-eval: https://github.com/escopecz/js-expression-eval
and reveals them in a step-by-step manner, with automatic timing between each question, and the timing between each step varying depending on the number of steps, to fit within the question timing.