How to use AJAX and JSON to get data returned from a PHP file

Question

For starters this website is being run on a Debian machine. I have a SQLite3 database that has current news articles in it. I am trying to use PHP to query the database for these articles, and pass it as JSON to AJAX, so it can be displayed on my webpage. Right now nothing is being shown and I don't know where the error is.

Here is the PHP code to get the information from the database:

<?php

class MyDB extends SQLite3
{
    function __construct()
    {
        $this->open('website.db');
    }
}

$db = new MyDB();
$result = $db->query('SELECT * FROM news');
echo json_encode($result);
?>

Here is the JavaScript where the AJAX is located:

<script type="text/javascript">

 function getNews()
 {
     console.log("firstStep");
      $(document).ready(function()
      {

        console.log("secondStep");
        $.getJSON("http://localhost/getNews.php",function(result){

            console.log("thirdStep");
            $('news').append(result); // display result

                 });
       });
  }

I think the error is occurring around $.getJSON("http://localhost/getNews.php",function(result), as in the console, thirdStep is never being outputted.

This is the HTML it should be appending to: <div id = "newsEntry"> <news> test </news> </div>

Any help would be appreciated.

You can't append an object directly as HTML—some kind of iteration is required. Can you tell us the structure of your JSON? You can check that by doing console.log(result). — Terry
– Terry, Commented Jun 23, 2015 at 19:24
did you check console.log(result) to see if you really did get anything back from your script? — Marc B
– Marc B, Commented Jun 23, 2015 at 19:26
@marc-b The thing is, I added console.log(result) right under the $.getJSON, and nothing is logged. It seems like that function is not running at all. — ejoe23
– ejoe23, Commented Jun 23, 2015 at 19:28
Perhaps the request is failing because it can't decode the json. Check api.jquery.com/jquery.getjson and add some handling in case it fails so you can see what is going on. Also, please post an example of the JSON output of getNews.php — Michael
– Michael, Commented Jun 23, 2015 at 19:34
@Michael Yes, the request is failing. I'm assuming it is because it can't decode the json. I am very new to json and don't really know how to format it correctly. What you see in the php above is all I have written. — ejoe23
– ejoe23, Commented Jun 23, 2015 at 19:40

Hauke P. · Accepted Answer · 2015-06-23 19:44:10Z

1

To find out what's going on, you might want to add an error handler:

$(document).ready(function() {
  $.ajax({
    url: "http://localhost/getNews.php",
    dataType: "json",
    success: function(result) {
      console.log("thirdStep");
    },
    error: function(err) {
      alert(err);
    }
  });
})

answered Jun 23, 2015 at 19:44

Hauke P.

2,8531 gold badge24 silver badges48 bronze badges

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

6 Comments

ejoe23 Over a year ago

When I use your function, the alert that is given shows [object Object]

Hauke P. Over a year ago

Okay, better replace alert(err) with console.log(err) then. Find out more about the error in the console.

ejoe23 Over a year ago

What gets logged is:

Object {readyState: 4, responseText: "<?php↵↵class MyDB extends SQLite3↵{↵    function _…charset=utf-8');↵echo json_encode($result);↵↵↵?>↵", status: 200, statusText: "OK"}

Hauke P. Over a year ago

Okay, it looks like PHP isn't even running on your web server... So do other PHP scripts run after all? What is for example happening if you place another file next to getNews.php called phpinfo.php and go to http://localhost/phpinfo.php with your web browser?

light Over a year ago

@ejoe23 I think you need to do some due diligence before posting your questions here. When you post your PHP code and your jQuery code, we have to assume that you got PHP running and you have javascript enabled and you have included jQuery. You should not mask a "How do I set up PHP" question behind a programming question.

|

light · Accepted Answer · 2015-06-23 19:52:12Z

1

By default, the web server serves content as application/html. So when you simply echo a JSON string, it's treated like text on a html page. To really return JSON from your server, you need to specifically set it.

Include this line before your echo:

header('Content-Type: application/json; charset=utf-8');

Edit

On inspection of you PHP code, you are missing one line. Note that $db->query() returns you an SQLite3Result. You need to call:

$array = $result->fetchArray(SQLITE3_ASSOC);  // get an associative array first
$json = json_encode($array);
header('Content-Type: application/json; charset=utf-8');
echo $json

edited Jun 23, 2015 at 19:52

answered Jun 23, 2015 at 19:40

light

4,3173 gold badges29 silver badges39 bronze badges

5 Comments

ejoe23 Over a year ago

See the comment that I wrote to @Michael. I think I don't have my json formatted correctly, as the getJSON request is still failing, even after I added what you suggested above.

light Over a year ago

Have you tried simply putting http://localhost/getNews.php in your browser to see what you actually get?

ejoe23 Over a year ago

It just downloads the php file

light Over a year ago

Then something is wrong with your server setting. It should not be serving PHP files as downloads. It should run the PHP code and output whatever you have echo-ed

Hauke P. Over a year ago

Oh, okay, I understood the "It just downloads the php file" as "It just downloads what is generated by the php file". Well, now I found out the same thing as you did, @light. Heh.

Collectives™ on Stack Overflow

How to use AJAX and JSON to get data returned from a PHP file

2 Answers 2

6 Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related