php variable with javascript echoing

Question

Im working on modifying my page once a user is logged in. (changing the login logo and display welcome username next to it). so far the img swapworks, but i cannot seem to add $userId into the script to display the sessions username, just the welcome back part works if i remove the $userId. Its weird because when i do this with PHP and HTML it works quite easily.

<?php 
if (isset($_SESSION['logged_in'])) { 
    $userId = $_SESSION['username'];

    echo '<script>  
        var img = document.getElementById("imgSwap");
        img.src = "images/lockClosed.png"; 
        </script>';

    echo '<script>
        var userId = '."$userId".';
        var text = document.getElementById("loggedInMsg");
        text.innerHTML = "Welcome Back, + userId"; 
        </script>';        
}

Naming this ID is only going to cause confusion, $userId = $_SESSION['username']; I would just name it what it is $username = $_SESSION['username']; — ArtisticPhoenix
– ArtisticPhoenix, Commented Apr 11, 2019 at 5:39

M. Eriksson · Accepted Answer · 2019-04-11 05:15:47Z

2

If $userId is a string, it needs to be quotead in JS.

This should work:

<?php 
if (isset($_SESSION['logged_in'])) { 
    $username = $_SESSION['username'];

    // Let's end the PHP block and output our JS
    ?>

    <script>  
        var img = document.getElementById("imgSwap");
        img.src = "images/lockClosed.png"; 

        var username = '<?= $username ?>';
        var text = document.getElementById("loggedInMsg");
        text.innerHTML = "Welcome Back, " + username; 
    </script>;        

    <?php
    // Now when we're done with the JS, open the PHP block again
}

In my opinion, it's way easier to end the PHP block instead of echoing HTML and JS using PHP, since you then get some proper syntax highlighting and don't need to care about escaping quotes etc.

(I also changed the variable $userId to $username, since it's the username we want to output, not the id)

So, what was the actual issue?

You have a couple of issues:

First issue

'var userId = '."$userId".';`

Since $userId here is a string with the username, it wouldn't be quoted and result in: var userId = foo; instead of var userId = 'foo';.

You need to make quote it like this:

'var userId = "' . $userId . '";`

As you see, now the " is in the JS string instead of around the PHP variable.

Second issue

`'text.innerHTML = "Welcome Back, + userId";`

Here's you're not concatenating the strings, but are literally outputting "Welcome Back, + userId";. For the strings to be concatenated, you need to end the first string:

`'text.innerHTML = "Welcome Back, " + userId;`

edited Apr 11, 2019 at 5:15

answered Apr 11, 2019 at 4:52

M. Eriksson

13.7k4 gold badges31 silver badges42 bronze badges

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

5 Comments

crimsonchin Over a year ago

this worked. thank you! im still confused how the other way cannot work though? or can it?

M. Eriksson Over a year ago

@crimsonchin - I added an explanation about what the issues with your original code was.

crimsonchin Over a year ago

thanks, everything is clear exept the first issue. Could u post a snippet of how it would look?

M. Eriksson Over a year ago

@crimsonchin - Check the updated explanation about what the original issue was and see if it make things clearer.

crimsonchin Over a year ago

Worked like a charm, amazing! ty

Alex · Accepted Answer · 2019-04-11 04:48:12Z

0

If you want to concatenate variable to string in javascript you have to seperate it from string since + is just another ASCI character if it is in quotation marks and it does not concatenate : text.innerHTML = "Welcome Back, + userId"; should be text.innerHTML = "Welcome Back, "+ userId;

answered Apr 11, 2019 at 4:48

Alex

5074 silver badges16 bronze badges

3 Comments

crimsonchin Over a year ago

true getting confused mixing everything... tried it but still doesn't work! ;/

Alex Over a year ago

What do you get displayed with text.innerHTML = "Welcome Back, "+ userId;?

crimsonchin Over a year ago

nothing at all it outputted the old string from that div

gitguddoge · Accepted Answer · 2019-04-11 04:56:57Z

0

It could be the problem of the quotes. you can try include quotes when echo out the value

<?php if(isset($_SESSION['logged_in'])){ 
        $userId = $_SESSION['username'];
        echo '<script>  
            var img = document.getElementById("imgSwap");
            img.src = "images/lockClosed.png"; 
            </script>';
        echo '<script>
            var userId = "'.$userId.'";
            var text = document.getElementById("loggedInMsg");
            text.innerHTML = "Welcome Back, + userId"; 
            </script>';        
}

edited Apr 11, 2019 at 4:56

answered Apr 11, 2019 at 4:42

gitguddoge

1721 silver badge9 bronze badges

1 Comment

M. Eriksson Over a year ago

A good answer includes a description about why the OP should try it. What problem does it solve and how?

Collectives™ on Stack Overflow

php variable with javascript echoing

3 Answers 3

So, what was the actual issue?

5 Comments

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

So, what was the actual issue?

5 Comments

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related