How can I update some placeholder text using form, input and php?

Question

I am trying to update some placeholder text (not the placeholder attribute) with values that come from a form-input, that are all on the same HTML page. So I have one index.html file and one test.php file.

I am very new to PHP. I barely understand what it is and how it works. I couldn't find anything online specific to my issue.

I am using an Apache2 Server and PHP 7.2 installed on Linux Mint 19.1.

<!DOCTYPE html>

<html>    
<head>
    <meta charset = "utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">    
    <link rel = "stylesheet" type = "text/css" href = "master.css">   
    <title>Home Page</title>
</head>
<body>
            <div id = "center_text_box">
                <p>URL:</p> <p><span>%PLACEHOLDER_URL%</span></p>
                <p>URL Refresh Rate:</p><p><span>%PLACEHOLDER_URR%</span>(s)</p>
                <p>Brightness:</p> <p><span><?php echo 'Brightness: '.$Brightness;?></span>(&#37;)</p>
            </div>
<form method="post" action="">
                        <input id="text-input" type="url" inputmode="url" placeholder="Enter URL" name="getURL" value="" title = "URL">
                        <input  class="URR" id="text-input" inputmode="numeric" 
                                title="Enter a Refresh Time(s) between 1 and 10"
                                type="text"
                                pattern="([0-9]{1,2})"
                                oninvalid="this.setCustomValidity('Please enter a number between 1 and 10')"
                                onchange="try{setCustomValidity('')}catch(e){}"
                                oninput="setCustomValidity(' ')"
                                maxlength="2"
                                placeholder="*Enter URL Refresh Time (s)" name="getRefreshRate" value="">
                        <input  class="Brightness" id="text-input" inputmode="numeric" type="text" maxlength="2" pattern="([0-9]{1,2})"
                                oninvalid="this.setCustomValidity('Please enter a number between 2 and 99')"
                                onchange="try{setCustomValidity('')}catch(e){}"
                                oninput="setCustomValidity(' ')"
                                placeholder="*Enter Brightness (2-99)" name="getBrightness" value="" title="Enter a Brightness value between 2 and 99">
                        <input id="button" type="submit" name="save_values" value="Save Values">
                    </form>
</body>
</html>

<?php
// Check if the form is submitted 
if ( isset( $_POST['save_values'] ) ) { // retrieve the form data by using the element's name attributes value as key 
    $Brightness = $_POST['getBrightness'];
    $RefreshRate = $_POST['getRefreshRate'];
    $message = "Success ! You have entered Brightness: ".$Brightness." and RefreshRate: ".$RefreshRate;
    exit;
} 
?>

I would like for %PLACEHOLDER_URR% to update whenever I input a value using <input class="URR" name="getRefreshRate" value="">.

As you can see with Brightness I've tried replacing

<span>%PLACEHOLDER_Brightness%</span>

with

<span><?php echo 'Brightness: '.$Brightness;?></span>

but it did not work.

What can I do ?

@GrecoJonathan I would prefer PHP because I am trying to learn using it. — bleah1, May 24 '19 at 14:32
`action=""` is going to keep you on the same page. .. actually `` won't work on the `html` file either. — user3783243, May 24 '19 at 14:41
@user3783243 As you can see I'm already using: `
`. I've quite figured out that php won't work inside a .html file. That's why I posted here. Because I don't understand how or where php works. — bleah1, May 24 '19 at 14:42
So `I have one index.html file and one test.php file` is no longer correct? — user3783243, May 24 '19 at 14:46
As @kainaw mentioned in his answer I didn't say what my files were called, so I've edited the question to match my filenames. So index.html and test.php are correct. — bleah1, May 24 '19 at 14:49
So... PHP is a server side processing language it processes when it is called, which is when the file has a PHP extension. It processes blocks that start with ` — user3783243, May 24 '19 at 14:55
You are right ! I've made the Apache2 Server to read php that's inside a HTML. Now the script works. — bleah1, May 24 '19 at 15:08

kainaw · Accepted Answer · 2019-05-24T14:54:11.843

Many things to cover here...

You say that your html and php files are separate, but you didn't say what they are called. So, I am going to call them index.html and index.php. You will have to replace every instance of "index" with whatever file name you used.

In the index.html file, you submit to index.html because the action of your form is set to nothing. If you don't set it, it will submit to itself. Therefore, it will never ever access the index.php file. If you want it to access the index.php file, you must set the action of your form to index.php.

Because your index.html file submits to itself, ignore the index.php file. It won't be touched in any way. It doesn't matter if they are sitting on the same server. No magic happens. Files don't mysteriously intermingle. So, in your index.html file, you tried to print $Brightness, but nowhere in that file do you set a value for $Brightness.

You could include index.php in your index.html file. At the top of the index.html file, add:

<?php include('index.php'); ?>

That will load the index.php file and process it before continuing through the index.html file. So, it will set $Brightness if you've received a submission. If you don't get a submission, $Brightness won't be set. That is caused by your if statement. You state that you want to set $Brightness if and only if save_values is set in Post.

Warning: View the source code when you load the index.html page. If you see <?php include('index.php'); ?> in your web browser, your server is not parsing html files for PHP. You must rename your index.html file to index.php - which may conflict with your existing .php file. This is a server setting. I set my personal server to process PHP in html files. Some people don't do that.

Warning: You have "exit" in your index.php. Remove that. It will kill your whole thing. You want it to do some work and then keep working.

Now, in your index.html file, you can't just print $Brightness. It might not have a value. You can use an if statement like you already did in the index.php file:

if(isset($Brightness)) print "Brightness: ".$Brightness;

Now, you can follow the flow. You load the page the first time. Nothing is posted, so when you include index.php, it doesn't set anything. The index.html file processes. $Brightness wasn't set, so it isn't printed. You type stuff in the form and submit it. The page loads again. This time, index.php sets $Brightness and index.html prints $Brightness.

If the server hasn't been configured to execute PHP with a `.html` then `include index.php in your index.html` won't work. — user3783243, May 24 '19 at 14:48
I've added `` at the top of index.html. I've changed to ``. I've deleted `exit;` and it still doesn't work. — bleah1, May 24 '19 at 14:51
@user3783243 I'm beginning to think that is indeed the case. — bleah1, May 24 '19 at 14:52
@bleah1 Did you read the Warning: messages or did you simply copy and paste code? — kainaw, May 24 '19 at 14:52
There weren't warning messages when you first posted. I am reading them now. `` is commented out. So my server can't process php that's inside a html file. — bleah1, May 24 '19 at 15:02
I've made the Apache2 Server able to read PHP that's inside a HTML file with this: https://stackoverflow.com/a/40138462/11233023 . After doing that the script works. Thank you ! — bleah1, May 24 '19 at 15:07

How can I update some placeholder text using form, input and php?

1 Answers1