How to pass JavaScript random.Math results to PHP

Question

I'm have created a random slot machine with JavaScript, which works perfectly fine. After the result is shown in the slot machine, a button to open a modal/dropdown window appears, here the user can get more details about their results (bigger image, text, titles, google map locations etc). But for the next part of my project I have created user logins (using PHP & MySQL), so now I want to save the randomly generated result shown inside the modal/dropdown window (JavaScript) to the user's personal profile side (PHP/SQL) so that they can recheck their results when ever they feel like it.

Does anyone know any good solutions?

I have a JavaScript random image generator (with accompanying attributes) which looks like this:

const array = [
{img: 'img1.png', text:'image one', title:'etc etc etc'}
//img2 & img3 under here.
];

function generate(){
setTimeout(funtion first_img() {
index = Math.floor(Math.random() * array.length)
var display = array[index]
     
var result = document.getElementById('box').innerHTML += '<div><h2>' + `${display.title}` + '</h2><img src="' +`./img/${display.img}`+'"><p>'+`${display.text}`+'</p></div>'

document.querySelector('input["data"]').value = result;
  
}, 3000);
}
function modal_window(){
document.getElementById('before-box').style.display = 'none';
document.getElementById('modal-window').style.display = 'block';
}

This is displayed in my Index.php file after the button is clicked.

<button onclick="generate()">Generate Image</button>
<div class="open-modal-btn">
<button onclick="modal_window()">See details</button>
</div>
<div id="before-box"></div>
<div id="modal-window">
<div class="box"><
<form method="get" action="profile.php">
<input type="hidden" name="data"/>
</form>
<a href="profile.php">See Profile Results</a>
</div>
</div>

Now, I want to save this result to my Profile.php file and save it there for like two weeks, ish, but I don't know how, the $_GET['data'] is just an example because I can't have name="" attributes in div tags, which is why I don't know what should be there - it would have worked with input name="data", but in my case, the user is not supposed to contribute.

<?php
include ('conn.php');
session_start();
$res = $_GET['data'];
echo $res;
?>

I have the JavaScript array stored inside my SQL database in the same manner, with numbered ID as 0-2 (since JavaScript arrays start at 0), is there any way I can match the random number index with the SQL ID when retrieving the data maybe? for example:

<?php
$id = $_GET['data'];
$sql = mysqli_query($conn, "SELECT * FROM array WHERE id = '$id'");
?>

Any solutions or tips are greatly appreciated, thanks! PS: I do not mind implementing new code languages/variants to resolve this issue (AJAX, Python, etc) anything helps. From: a desperate bachelor student :`)

Move the `
` outside the `
` add an input `hidden` inside the `
` (``) after `document.getElementById('box').innerHTML` insert the value into input like `document.querySelector('input[name="data"]).value = whatyouwant` then in your php you will see the value correctly, for send automatically the form instead of use form you can use ajax. — Simone Rossaini, Nov 11 '22 at 09:51
The result was "undefined index "data" - most likely my fault somewhere, here's what I did: result = document.getElementById('box').innerHTML += 'contents' document.querySelector('input[name="data"]').value = result; — MLR., Nov 11 '22 at 10:10
**Warning:** You are wide open to [SQL Injections](https://php.net/manual/en/security.database.sql-injection.php) and should use parameterized **prepared statements** instead of manually building your queries. They are provided by [PDO](https://php.net/manual/pdo.prepared-statements.php) or by [MySQLi](https://php.net/manual/mysqli.quickstart.prepared-statements.php). Never trust any kind of input! Even when your queries are executed only by trusted users, [you are still in risk of corrupting your data](http://bobby-tables.com/). [Escaping is not enough!](https://stackoverflow.com/q/32391315) — Dharman, Nov 11 '22 at 11:41

score 0 · Answer 1 · answered Nov 11 '22 at 11:00

0

You need to submit the form but you use outside for go to profile, instead you need to use a button inside form like:

<form method="get" action="profile.php">
  <input type="hidden" name="data"/>
  <button type="submit">See Profile Results</button>
</form>

answered Nov 11 '22 at 11:00

Simone Rossaini

8,115
1
13
34

It finally worked - had to make the changes you mentioned, but also change the document.querySelector to getElementById and give the input a ID attribute! Thank you so much for your help! – MLR. Nov 11 '22 at 12:39

How to pass JavaScript random.Math results to PHP

1 Answers1