Pass a javascript variable to another page when form is submitted. with just html and Javascript

Question

Good day, I am trying to pass a java script variable along with 2 user inputs. I am unable to get the code to work the email and name go to HighScore.php just fine, but I keep getting zero for the hidden field. highscore1 is the name of the variable. I don't know J Query, so I need a HTML java-script solution. Thank you for looking.

 <form method="post" name="form" action="HighScore.php">
            <input type="text" placeholder="Enter Name" name="username">
            <input type="text" placeholder="Enter Email" name="email">
            <input type="hidden" name="highscore1" id="hidden_score" value= highscore1>
            <input type="submit" name="add" value=Enter>

        </form>

Hidden variable must have quotes for value... It's first that i found here... — Mykola Kikets, Jun 13 '20 at 16:02
highscore1 is a java-script variable the page sending the information is in html and java-script. — Jason, Jun 13 '20 at 16:04
If it's a js variable we need to see where it is initialized — Mykola Kikets, Jun 13 '20 at 16:04
@Jason you want to pass 2 input text fields & one hidden JS field to HighScore.php — KUMAR, Jun 13 '20 at 16:08
Yes Kumar exactly that but the hidden field is a JS variable — Jason, Jun 13 '20 at 16:11
MYkola I added this right above the form and it still sends zero — Jason, Jun 13 '20 at 16:11
Does this answer your question? [How to save user input into a variable in html and js](https://stackoverflow.com/questions/17433557/how-to-save-user-input-into-a-variable-in-html-and-js) — shuberman, Jun 13 '20 at 17:15

Thien Huynh · Accepted Answer · 2020-06-13T16:42:15.993

I think in your case, you should first use javascript to get/set hidden_score input, you can use it anywhere in your html page, as long as you ensure that input is fully rendered, you can simply add it inside of $(function() { /*you can put your code here*/ }) for jQuery version, and document.addEventListener('DOMContentLoaded', function(event) { /*you can put your code here*/ })for javascript version

<script>
document.getElementById("hidden_score").value = "Set value here";
</script>

And then, in your HighScore.php, you can use this for getting that value depend on form method: $_POST['hidden_score'] for post and $_GET['hidden_score'] for get

That was a simple and elegant solution it worked perfectly. Thank you and everyone else that took the time to answer. — Jason, Jun 13 '20 at 16:47

score 1 · Answer 2 · answered Jun 13 '20 at 16:08

1

function setHighScore()
{
    document.getElementById("hidden_score").value = "Set value here";

}

now you can call the above function on any event that meets your requirement

answered Jun 13 '20 at 16:08

Ashish Rawat

107
12

Thank you for that answer, but inside the form I can not call a function or can I? I just want to add the javascript value to what gets posted to the HighScore.php page. – Jason Jun 13 '20 at 16:16
1

yes you can do it inside the form also yo can do it this way: . – Ashish Rawat Jun 13 '20 at 16:25
1

You can just put the function in your ` – Cypherjac Jun 13 '20 at 16:26

Pass a javascript variable to another page when form is submitted. with just html and Javascript

2 Answers2