Ajax Async and Cyclic PHP request from JavaScript function

Question

Dumb question. I have two pages, "Index.html" and "func.php" in the same directory. I'm trying to call the PHP page every 2 seconds, get it's ECHO and display it on a paragraph element. No error, but the paragraph text simply won't change (and stay 0), here's the code:

Index.html

<html>
<body>

    <?php
        int cont = 0;
    ?>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" type="text/javascript"></script>
    <script>

        req()
        { 
            $.ajax({url: "func.php"}, success: function(data) {
                document.getElementById("p1").innerHTML = data;
            });
            setInterval(req(), 2000);
        };

        $('document').ready(function(){
            setInterval(req(), 2000);
        });

    </script>

    <p id="p1">0</p>
</body>

func.php

<?php
    cont++;
    echo cont;
?>

Any help?

Your php code is broken. Variables start with $. You are never initializing the variable $cont anywhere too but try to increment it. EDIT: I see you do int cont = 0; on the top in index.html but that will never work, learn the basics of php. — xate
– xate, Commented Dec 19, 2018 at 10:18
Every time you'll do your ajax call, the php script is initialised and your variable will have the same value. you might need to work with sessions. — Cid
– Cid, Commented Dec 19, 2018 at 10:22
@Xatenev yes sorry, i'm a beginner with PHP but that's just an oversight... I'm working with a lot different programming languages these days... however changing it in '$cont = 0;' didn't fix it. — user2959923
– user2959923, Commented Dec 19, 2018 at 11:01
@user2959923 Of course it didn't. Thats why I said learn the basics of php, and that includes the basics of the HTTP Request & Response Model. — xate
– xate, Commented Dec 19, 2018 at 11:30

John B. Walugembe · Accepted Answer · 2018-12-19 11:03:52Z

With the PHP syntax issues mentioned in the first comment above addressed, there are also issues with the javascript: the } after func.php is misplaced and needs and needs to be placed at the end of the ajax callback function instead. There is no need to have a setInterval() in the req() function because that is catered for when the function is called. There is also a missing function before the definition of the req() function.

To achieve the purpose, you would need to use PHP sessions, as mentioned in the second comment. Actually you do not need the PHP code in the index.html file. Here is a possible solution:

index.html:

<html>
<body>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" type="text/javascript"></script>

  <script>

      function  req()
        { 
            $.ajax({url: "func.php", success: function(data) {
                document.getElementById("p1").innerHTML = data;
            }});

        };

        $('document').ready(function(){
            setInterval(function(){req();}, 2000);
        });

    </script>

    <p id="p1">0</p>
</body>
</html>

func.php:

<?php session_start();

if(!isset($_SESSION['cont'])){
   $_SESSION['cont'] = 0;}
    else
    {$_SESSION['cont'] += 1; }

    echo $_SESSION['cont'];

?>

Collectives™ on Stack Overflow

Ajax Async and Cyclic PHP request from JavaScript function

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related