Pass variable from PHP to HTML - php

Question

I have a page, play.html:
<form method="post" action="play.php">
<input type="hidden" name="mp3name" value="/MP3/1.mp3">
<input type="submit" value="Play My MP# #1" />
</form>
<form method="post" action="play.php">
<input type="hidden" name="mp3name" value="/MP3/2.mp3">
<input type="submit" value="Play My MP# #2" />
</form>
This calls another page, play.php:
<?php
$formurl = "play.html" ;
$playerurl = "player.html" ;
$mymp3 = $_GET["mp3name"];
header( "Location: $playerurl?mp3name=$mymp3" );
exit ;
?>
Then it calls another page, player.html:
<audio id="player" src="$mymp3" autoplay preload="auto"> </audio>
<div>
<button onclick="document.getElementById('player').play()">Play</button>
<button onclick="document.getElementById('player').pause()">Pause</button>
<button onclick="document.getElementById('player').volume+=0.1">Volume Up</button>
<button onclick="document.getElementById('player').volume-=0.1">Volume Down</button>
</div>
How do I pass a variable from PHP to player.html?

Answer 1

You are getting the variable $mymp3 with $_GET while you are using <form method='post'.., change it to $mymp3 = $_POST['mp3name'];
Then, change your player.html extension to player.php to use PHP code on it.
So, when you have your player.php file, change this...
<audio id="player" src="$mymp3" autoplay preload="auto"> </audio>
to this...
<audio id="player" src="<?php echo $mymp3 ?>" autoplay preload="auto"> </audio>

Answer 2

You can't if it's just a plain HTML file. Change it to a PHP file and use <?= $_GET['mymp3'] ?>. In play.php, since you're passing mp3name via POST, you'll also want $_POST instead of $_GET.
And if you're not using PHP 5.4, <?php echo $_GET['mymp3']; ?> would be the recommended way to do it (thanks #Palladium).

Answer 3

Probably the easiest way (at least given the information we have from the question) would be to get rid of the redirect from play.html to player.html and emit the player from the former instead of have it be a static HTML page. So play.html would look something like this:
$formurl = "play.html" ;
$playerurl = "player.html";
$mymp3 = $_GET["mp3name"];
<audio id="player" src="<?php echo $mymp3; ?>" autoplay preload="auto"></audio>
<div>
<button onclick="document.getElementById('player').play()">Play</button>
<button onclick="document.getElementById('player').pause()">Pause</button>
<button onclick="document.getElementById('player').volume+=0.1">Volume Up</button>
<button onclick="document.getElementById('player').volume-=0.1">Volume Down</button>
</div>
Or is there a particular reason why this needs to happen through a redirect? If it must be a redirect then the fact that it's an HTML page limits your options, since it wouldn't have server-side processing. You can pass the value along in the query string as you already try:
header("Location: $playerurl?mp3name=$mymp3");
But then you run into the problem of reading it from the query string without server-side processing. You may be able to do this with JavaScript, though. You'd have to read the value and set the src attribute on the audio element. But it would probably be a lot easier and more reliable to do this with server-side processing.

Answer 4

Full html code, form, entire page can all be put in the first PHP itself. Copy everything from the second HTML and put at the bottom of the original PHP file itself. Remove the redirect command header( "Location: $playerurl?mp3name=$mymp3" ); from your PHP. Instead write with full html file with your code
<audio id="player" src="$mymp3" autoplay preload="auto"> </audio>
<div>
<button onclick="document.getElementById('player').play()">Play</button>
<button onclick="document.getElementById('player').pause()">Pause</button><button onclick="document.getElementById('player').volume+=0.1">Volume Up</button><button onclick="document.getElementById('player').volume-=0.1">Volume Down</button>
</div>
and put them below the ?>.
Save the entire file (your php with full HTML at the bottom) all as one file with .php as extension.
Now your HTML code has the variable $mymp3 that was already defined within PHP section itself and its value will be available to all the HTML and other PHP codes within that file. You can add several php and html sections) all within the same file. Save the entire file in one name with the extension .php.
You do not not need another separate html doc for this. In PHP you can mix and mingle php code and HTML pages.