Pop-up box javascript+PHP code mixture not working?

Question

I'm working on a massive project which includes a pop-up box with cookie information that will only open the first time in the session but somewhere in the mess of javascript and PHP I seem to have made a mistake or something as it's not appearing whatsoever...

Here's the snippet of code:

<div  id='popup' style='border-radius: 1vw; display: hidden; background-color: white; padding: 2vw; position: fixed; top: 20%; right: 25%; z-index: 999; width: 50vw; height: auto; margin-left: 15; margin-right: 15; border-style: solid; border-color: #181818; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);'>
<a  class="sidebar" style="position:absolute; top:0 ;right: 1vw;font-size: 36px; margin-left: 50px;" #href="javascript:void(0)" class="closebtn" onclick="closePopUp()">&times;</a> <!-- The button which activates Javascript to close the pop up box -->
<img id='cookiepic' src='cookie.jpg' style='width: 3vw; height: 3vw; display: hidden;'>
<p class='spacedfont' style='display: inline' > &nbsp Oh, and by the way...</p>
<hr>
<div style='display: flex; flex-direction: row; display:hidden;' id='cookieinfo'>
<p id='cookiep' style='letter-spacing: 1px;'>
As is common practice with almost all professional websites, this site uses cookies, which are tiny files that are downloaded to your computer, to improve your experience.
<br><br>This page describes what information they gather, how we use it and why we sometimes need to store these cookies.
<br><br>We will also share how you can prevent these cookies from being stored however this may downgrade or 'break' certain elements of the sites functionality.
<br><br>By closing this notice or continuing to use the site, you consent to our use of cookies.
</p>

</div>

<div style='display: flex; flex-direction: row; display:hidden;' id='aboutinfo'>
<p id='aboutp'>
We're a fresh business to the world of e-commerce that aims to bring you the best experience shopping online.
<br><br>Our business is based in the UK but our web of business relationships stretches worldwide to deliver you the best service.
<br><br>Part of our ethos is innovation, a key role in our success which allows us to scour the globe for offers and deals to bring to you almost daily. Be sure to check the featured panel for a taster of what we've found recently!
<br><br>If you'd like to know anything else, email a member of our friendly team at xxxxx@gmail.com
</p>

</div>
</div>




<script>
function closePopUp() {
    document.getElementById("popup").style.display = "none";
    document.getElementById("cookieinfo").style.display = "none";
    document.getElementById("cookiepic").style.display = "none";
    document.getElementById("aboutinfo").style.display = "none";
}
function openPopUp() {
    document.getElementById("popup").style.display = "block";

}
function showCookie() {
    document.getElementById("popup").style.display = "block";
    document.getElementById("cookieinfo").style.display = "inline";
    document.getElementById("cookiepic").style.display = "inline";
    <?php
    $_SESSION['cookieconsent'] = true;
    ?>
}
function showAbout() {
    document.getElementById("popup").style.display = "block";
    document.getElementById("aboutinfo").style.display = "inline";
}

closePopUp();

<?php
if(empty($_SESSION['cookieconsent'])) {
    echo "showCookie()";
}
?>
</script>

Does anybody know what's wrong? Any help will be much appreciated and, for the record, I prefer to keep CSS inline.

the php code inside `showCookie()` doesn't make sense. It will _allways_ be executed. So at the time you get to the buttom, `$_SESSION['cookieconsent']` will _allways_ be set (and therefor `showCookie()` will never be called) — Jeff, Oct 25 '18 at 15:27
Hi and welcome to StackOverflow! Please edit your example to include only the code relevant to your question. We call this an [MCVE](https://stackoverflow.com/help/mcve). That way, you also won't have to justify why you don't use external stylesheets /hint: there's no reason not to except when dealing with email-templates in HTML) — Oliver Baumann, Oct 25 '18 at 15:28
move `$_SESSION['cookieconsent'] = true;` to _after_ `echo "showCookie()";` (but inside the if) — Jeff, Oct 25 '18 at 15:29
Possible duplicate of [What is the difference between client-side and server-side programming?](https://stackoverflow.com/questions/13840429/what-is-the-difference-between-client-side-and-server-side-programming) — Jeff, Oct 25 '18 at 15:32
@Jeff why did you flag as a duplicate *and* posted an answer? — Funk Forty Niner, Oct 25 '18 at 16:41
@FunkFortyNiner because I first posted the answer to clarify (and to help the OP) - but since the main problem is about server code not reacting on client code I flagged afterwards. Thanks for the spelling corrections by the way! — Jeff, Oct 25 '18 at 16:52
@Jeff So if the question gets closed by the community, some may think that that is a form of monopoly. You're welcome on my editing. — Funk Forty Niner, Oct 25 '18 at 16:57
@FunkFortyNiner I'm not sure I get your point. If I hadn't flagged it someone else could have. You mean monopoly in terms of rolling the dice (from my side or the community)? — Jeff, Oct 25 '18 at 17:15
@Jeff Here is a form of definition on the word: https://en.wikipedia.org/wiki/Monopoly - In short: it's having sole control. — Funk Forty Niner, Oct 25 '18 at 17:20

score 1 · Accepted Answer · edited Oct 25 '18 at 16:40

The php code inside showCookie() will always be executed (because clientside javascript doesn't affect the serverside php code).
So at the time you get to the button, $_SESSION['cookieconsent'] will always be set (and therefore showCookie() will never be called).

Quick solution:

move $_SESSION['cookieconsent'] = true; to after echo "showCookie()";:

<?php
if(empty($_SESSION['cookieconsent'])) {
    echo "showCookie()";
    $_SESSION['cookieconsent'] = true;
}
?>

Pop-up box javascript+PHP code mixture not working?

1 Answers1