PHP echo out javascript

Question

On form submit, I want to give the user a message.

Originally, I was doing

if(isset($_POST['submit'])) {
echo "submitted"; 
}

But this would appear randomly at the top of the page.

I want control where the message is output, so I wanted to append the message to a DOM element... to do that, I thought I could use JavaScript as so:

if(isset($_POST['submit'])) {
    echo "<script type=\"text/javascript\">
            document.getElementById(\"submitmsg\").innerHTML = \"submitted\";
          </script>";
}

The HTML shows that the PHP seems to output the JS correctly, but submitmsg is empty.

enter image description here

Any thoughts?

HTML form: calls itself so it can run the PHP code at the top of the page:

<form role="form" action="" method='post' accept-charset='UTF-8'>
    <div class="row">
        <div class="form-group col-xs-12 floating-label-form-group">
            <input class="form-control" type="text" name="name" placeholder="Name">
        </div>
    </div>
    <div class="row">
        <div class="form-group col-xs-12">
            <button type="submit" name="submit" class="btn btn-lg btn-success">Send</button>
        </div>
    </div>
</form>

When your browser encounters a script tag, it immediately executes it. At that time, the browser has not parsed your <p> element yet and thus an error will be thrown (since your javascript is fetching an element that doesn't exist yet). — Bart
– Bart, Commented Jun 13, 2014 at 0:51
@Bart how do I ensure that the <p> element is loaded before appending the text? — user3871
– user3871, Commented Jun 13, 2014 at 0:53
bart ment you have to output your p tag first before outputting your js — Viscocent
– Viscocent, Commented Jun 13, 2014 at 0:54
@Growler put the echo statement after the <p> element or use the window.onload event. — Bart
– Bart, Commented Jun 13, 2014 at 0:54

Loïc · Accepted Answer · 2014-06-13 01:02:33Z

3

Not sure what you really do since you didn't post all the code, but I see 2 options.

First : On submit, you use an ajax query and don't refresh the page. If that's the case you should use the oncomplete() callback to do the javascript stuff (php should not return javascript code).

Second : The page is reloaded, then you should use PHP to directly echo html wherever you want in your code :

<nav ... >...</nav>
<p id='submitted><?= isset($_POST['submit']) ? "Submitted" : "" ?></p>

Note that you can put php tags where you want really :

<html>
     <head>
           <title><?php echo "Today is " . date('Y-m-d');?></title>
     </head>
     <body>
           <?= "My Cool Body" ?>
     </body>
 <html>

edited Jun 13, 2014 at 1:02

answered Jun 13, 2014 at 0:56

Loïc

12k2 gold badges35 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Ohgodwhy Over a year ago

I think you mean window.onload for native javascript

user3871 Over a year ago

I like the second option. However, the message is output even after I refresh the page. If I refresh, shouldn't the isset be reset to false?

Loïc Over a year ago

@Ohgodwhy I was mentionning XMLHttpRequest callbacks

Loïc Over a year ago

@Growler it depends. Often your web browser will ask you if you want to re-post the request, if you do, then it's a new submit.

Ohgodwhy Over a year ago

@Growler which you can prevent from occuring if you use header('Location: path/to/my/file.php'); and use $_SESSION variables to check the isset.

Ryan · Accepted Answer · 2014-06-13 00:55:48Z

1

I want control where the message is output

Why don't you store the submit status in a PHP variable and output it where required:

<?php
$is_submitted = isset($_POST['submit']);
?>

<html>
<body>
<!-- your page -->
<nav></nav>

<?php if($is_submitted) : ?>
    <p id="submitmsg">Submitted</p>
<? endif; ?>

Or even just put your isset() check inline further down your page.

But this would appear randomly at the top of the page.

There is no point in echoing out a Javascript call to display this message, you can put PHP where ever you want to in a document.

edited Jun 13, 2014 at 0:55

Ryan

14.7k9 gold badges68 silver badges104 bronze badges

answered Jun 13, 2014 at 0:54

scrowler

24.4k10 gold badges67 silver badges99 bronze badges

2 Comments

user3871 Over a year ago

I'm confused. If PHP is server side and therefore loaded before client-side HTML, wouldn't the PHP be run before the HTML loads anyway? Therefore, how can you "place" PHP further down in the document and have it execute in that order?

scrowler Over a year ago

PHP is executed server side, and in your case you're generating HTML with it. Once PHP has executed, you have your HTML document which is sent to the client. You can control where you put your PHP generated content by putting it anywhere in your HTML page. The only way this wouldn't work is if you're generating a large amount of your page structure with Javascript (which is unusual).

nousefortoast · Accepted Answer · 2014-06-13 01:03:34Z

0

the other answers are pretty much the right way.. if you wanna stick with the way you're doing things now, just switch your php output to:

window.onLoad = document.getElementById("submitmsg").innerHTML = "submitted";

if the Page is reloaded anyway you can echo submitted where you need it.

answered Jun 13, 2014 at 1:03

nousefortoast

312 bronze badges

Collectives™ on Stack Overflow

PHP echo out javascript

3 Answers 3

5 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related