0

I am currently creating a basic maths website where it would ask the user to solve a multiply question.

I'm planning to have the HTML layed out like:

1*8 = <input type="number" maxlength="3" name="answer1"><br>
2*9 = <input type="number" maxlength="3" name="answer2"><br>
4*4 = <input type="number" maxlength="3" name="answer3"><br>
<button type="button">Check Answers</button>
<p></p>

This HTML code is generated by some PHP code:

<?php
    $t = 0;

    for ($n = 1; $n <= 10; $n++) {

        $a = rand(1, 10);
        $b = rand(1, 10);

        echo $a . "*" . $b . " = <input type=\"number\" maxlength=\"3\" name=\"answer" . $n . "\"><br>";

        $t = $a * $b;
    }
?>

Now that is generated, I worked out what the total would be of the $a and $b (random numbers):

$t = $a * $b;

For the HTML button I wanted it so when the user clicks it, it would check all the input boxs and see if what they inputted = $t Forgetting all validation, all I want to get working for now is the very basics.

I've got further with this using ajax to create a on-click event:

$(document).ready(function(){
    $("button").click(function(){
        $.ajax({
            type: 'POST',
            url: 'calcc.php',
            success: function(data) {
                $("p").text(data);
            }
       });
   });
});

I've been messing around with it for a while now. I worked out that I would need to use $_SESSION or something similar to save the value of $t from before, but I can't seem to work out how it would all work, I keep getting errors of long repeated arrays and I have little idea how I would extract the information I want.

Another problem I am having is retrieving the users input upon the on-click, I have used POST and GET before but when I click the submit button it will act in a way where the page would reload and change all of the random numbers.

I preferably wanted to solve this in PHP. This has been bothering me for a while I just wanted to see if any of you had any great ideas of how I could make this work.

Thank you in advance.

2 Answers 2

1

There are 2 possible solutions for your problem.

  • The first one ( and most simple ) is retrieving your $_POST­[] parameters in the same script and executing the code when you receive a $_POST[] parameter that isn't empty.
  • The second solution ( the one that you are using here ) is to use AJAX. I looked at your code and have some adjustements.

    $(document).ready(function( e ){ //Add an preventDefault on your event in order to not do the submit of the form. e.preventDefault(); $("button").click(function(){ //Get all the data from your form var data = $(form).serialize(); $.ajax({ type: 'POST', //send the data with the ajax. // You can retrieve it in your php through $_POST['name of form field'] data: data, url: 'calcc.php', success: function(data) { $("p").text(data); } }); }); });

I hope this helps you :) Comment if you would like some more explanations.

Sign up to request clarification or add additional context in comments.

Comments

0

I would put $a and $b in input fields too. They could be readonly, or even hidden. In this case your php script gets your random $a and $b and the result from the user. Your php script can now validate the result. Tell me if you need some code.

1 Comment

Okay, I think I understand what your getting at, I would put the $a and $b random numbers on the HTML page along with the users input. I could get it all at once, and calculate the answer on the second PHP script (on-click) one. Basically another method instead of $_SESSION. Then the only issue I have is calling it to PHP. Thank you :)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.