Access php variables of a template with ajax

Question

I know that this question has already been answered in other topics but for some reason it doesn't work for me and I don't understand why.

I call a template with ajax and inside it there are set some php variables and i need to get those values.

first-template.php

<?php
$advert = array(
        'ajax' => 'Hello world!',
        'advert' => 'Bye',
     );
    echo json_encode($advert);
?>

second-template.php

?>
<script>
jQuery(document).ready(function($){
          
 $.ajax({
        beforeSend: function(){
        alert('Requesting...');
        },
        url : 'first-template.php',
        type : 'GET',
        dataType : 'json',
        success : function (result) {
           alert(result['ajax']); // "Hello world!" alerted
           alert(result['advert']) // "Bye" alerted
        },
         error : function(xhr, status, error) {
  alert(error);
}
    });

      });


</script>

This is how it is shown here but the function returns error.

Please elaborate on the description "doesn't seem to work". How specifically is this failing? Are there any errors in the browser's development console? In the browser's script debugger, is this code executed at all? In the network tab of the browser's debugging tools, is the AJAX request made? Does it contain the data you expect? What is the server's response? Please provide information about the problem. — David, May 14 '22 at 22:55
Sorry, I already corrected it. The function is not executed, no reports are seen in the console, nor is an alert fired if it is added to beforeSend, that's how I tried it too. — gomez, May 14 '22 at 22:57
The code shown, as-is, will produce an error indicating that the variable `data` is not defined. Can you provide a [mcve] which better demonstrates the problem? If the code is not executing at all, that suggests that either there's something significant about this which you aren't sharing in the example (JavaScript is disabled in the browser?) or that you aren't debugging this effectively. I'm afraid you're going to need to be much more clear about the problem. — David, May 14 '22 at 23:01
Exactly, you are right in undefined data. When I remove data, this function is executed but returns an error. It's my first time trying to pass values with json — gomez, May 14 '22 at 23:04
If the error callback is being invoked then the server is returning an error. Check the network tab of the browser’s debugging tools for the server response. Also check the PHP logs and web server logs. — David, May 14 '22 at 23:16

Harkhenon · Accepted Answer · 2022-05-14T23:36:52.330

First, maybe, you can change the request type to GET, because you don't post anything, but tried to get the information.

<script>
jQuery(document).ready(function($){
          
 $.ajax({
        beforeSend: function(){
        alert('Requesting...');
        },
        url : 'first-template.php',
        type : 'GET',
        dataType : 'json',
        success : function (result) {
           alert(result['ajax']); // "Hello world!" alerted
           alert(result['advert']) // "Bye" alerted
        },
        error : function () {
           alert("error");
        }
    });

      });


</script>

EDIT:

Here is a functional script:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        $(function() {
                
        $.ajax({
                beforeSend: function(){
                alert('Requesting...');
                },
                url : 'first-template.php',
                type : 'GET',
                dataType : 'json',
                success : function (result) {
                    console.log(result);
                },
                error : function(xhr, status, error) {
        alert(error);
        }
            });

        });
    </script>

See the modifications:

GET instead of POST
console.log(result) to see the result

In my browser console:

Object { ajax: "Hello world!", advert: "Bye" }

Just to be sure, do you load your JQuery properly and do you work on a WAMP/LAMP server?

Can you post the entire files code?

EDIT2:

Check error in console and post it here, this is more easy to find the problem in the future with it.

Yes, I thought about it and tried it too since the most logical thing was to use GET but it still returns an error. — gomez, May 14 '22 at 23:11
In my situation it returns: SyntaxError: Unexpected token < in JSON at position 37 — gomez, May 14 '22 at 23:38
Can you post the entire file by editing your last post? It will be more easy to find the problem — Harkhenon, May 14 '22 at 23:40
Ok, your code works fine. My problem was the rest of the code of the first template, I hid it and leaving only the variable, I then see the desired result in the console. Now I will work from there. Thank you very much for your support — gomez, May 14 '22 at 23:42
No problem, if you find the error and it works, it's fine! ;) — Harkhenon, May 14 '22 at 23:45

Access php variables of a template with ajax

1 Answers1