-1

Ok so I have a PHP variable I called on top of my document which is <? $mark = 0 ?> now when you click on the classes of content-1 and so on I want to change the value of that PHP variable. How can I do that? I know that it has to be done in Javascript because I want to change it upon a "click" which can only be determined with javascript.

My Code:

<!DOCTYPE html>
<html lang="en">
<head>
    <? $mark = 0; ?>
    <meta charset="UTF-8">
</head>
<body>

<div class="content-1">
<? if( $mark == 1 ){ ?>
<p>This is content One!</p>
<? } ?>
</div>

<div class="content-2">
<? if( $mark == 2 ){ ?>
<p>This is content Two!</p>
<? } ?>
</div>

<div class="content-3">
<? if( $mark == 3 ){ ?>
<p>This is content Three!</p>
<? } ?>
</div>


<script>
    $(document).ready(){
        $(".content-1").click(function(){
            //my attempt on changing the PHP variable $mark to 1
            document.write( "<? echo $mark = 1; ?>" );
        });
    }
</script>

</body>
</html>

My code above generated a white screen with the number 1 on the top left hand corner when I click on content-1

Help is greatly appreciated, thank you.

Lucas Santos
  • 1,359
  • 3
  • 24
  • 43
  • 1
    PHP executes before JS. JS can't interact with PHP unless there is an ajax request. – chris85 Jul 14 '15 at 20:44
  • @chris85 Yes but then the content will still be generated in the mark up. I am trying to speed up the load time of my page by not loading content that is not being displayed until they are necessary. – Lucas Santos Jul 14 '15 at 20:46
  • Use ajax in that case. View the source of your page. You won't (shouldn't) see ` echo $mark = 1; ?>`. – chris85 Jul 14 '15 at 20:46
  • @chris85 hmm well i'm not to familiar with AJAX yet, any idea how I would solve this with that approach? – Lucas Santos Jul 14 '15 at 20:54
  • Here's a jquery doc on AJAX, https://learn.jquery.com/ajax/. There also are a number of tutorials and threads on this topic. – chris85 Jul 14 '15 at 20:58
  • @chris85 Yeah I know Ajax isn't to complicated especially because I already know javascript so i'll give that documentation a read tonight. Thanks you! – Lucas Santos Jul 14 '15 at 22:12
  • @chris85 I wouldn't say duplicate, their two different questions. Especially to those who do not know. – Lucas Santos Jul 14 '15 at 22:14
  • There is another way by using AngularJS http.get method. Inlcude the JS on the bottom of your site and just use the method. After using ajax I find this one cleaner now... especially if you want to get more into front end programming, i think this is the 'newer' technique and the way to go. – hogan Jul 14 '15 at 22:15
  • @hogan I see i'll give that a read, but hey read my comment below for dim about the idea I had on how to do it with just javascript and tell me what you think – Lucas Santos Jul 14 '15 at 22:29
  • @LucasSantos Why don't you just use JS instead of using PHP? As I can see in the code above you never do anything in PHP which must be PHP. – hogan Jul 15 '15 at 17:20

1 Answers1

0

PHP executes before JS.

The only way to achieve this would be by using some form of asynchronous loading.

Like AJAX.

Then you could use an on click event to trigger reposting.

This might also help

It's another stack answer basically achieving what you are after.

Community
  • 1
  • 1
  • I see, I thought of another approach that may actually work with just javascript though. So instead of actually writing the mark up on the page have it assigned to some Javascript variables then append them onto a div based upon a click. So that way they are not being loaded until the click. – Lucas Santos Jul 14 '15 at 22:17
  • Not sure if it would work entirely or you might end up overpopulating content. You could also try using Post. but it will refresh the page –  Jul 14 '15 at 22:19
  • yeah I can't refresh, do you think the content will still be considered as "generated" if its just set in a javascript variable and not outputted? – Lucas Santos Jul 14 '15 at 22:33
  • Technically yes as they will get generated in your JS document but it's better than appearing on your html I suppose. You just want to check your DOM timings with that method though because you could end up causing render blocking or a large delay at the end of your page loading. –  Jul 14 '15 at 22:37
  • this question has been marked as a duplicate –  Jul 15 '15 at 21:53