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>

Answer 1

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

Answer 2

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

}

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