Displaying data from a database using Angularjs

Question

Basically what I am trying to do is ng-repeat records from my database, however, I am getting the following error 'SyntaxError: Unexpected token F in JSON at position 0'.

Here is my code:

HTML

<tr ng-repeat="x in data">
    <td>{{x.songName}}</td>
    <td>{{x.albumName}}</td>
</tr>

JS

$scope.loadTracks = function(){
    $http.get('includes/functions/gettrack.php').success(function(data){
        $scope.data = data;
    })
}

PHP

<?php

    header("Access-Control-Allow-Origin: *");
    header("Content-Type: application/json");

    $data = array();
    $sql = "SELECT * FROM tracks";

    // Create a prepared statement
    $stmt = mysqli_stmt_init($connection);

    // Prepare the prepared statement
    if (!mysqli_stmt_prepare($stmt, $sql)) {
        // Error exists
        die('Fatal error: service unavailable at this time');
    } else {

        // Run parameters inside the database
        mysqli_stmt_execute($stmt);
        $result = mysqli_stmt_get_result($stmt);


        if (mysqli_num_rows($result) > 0) {
            // Check for results and assign results to array
            while ($row = $result->fetch_assoc()){
                $data[] = $row;
            }
            echo json_encode($data);
        }
    }
?>

The error message is pretty clear: something is wrong with your JSON. We can't help you if you don't post it here — WirelessKiwi
– WirelessKiwi, Commented Nov 9, 2017 at 11:12

Jim Wright · Accepted Answer · 2017-11-09 11:43:06Z

2

I suspect that your code is executing die('Fatal error: service unavailable at this time');. Character 0 of that string is F which matches your error.

The JS will be trying to decode Fatal error: service unavailable at this time which is not valid JSON.

die() does not set an http code so the AJAX request will be considered successful. Try setting the code with http_response_code():

if (!mysqli_stmt_prepare($stmt, $sql)) {
    // Error exists
    http_response_code(500);
    die('Fatal error: service unavailable at this time');
} else {

You should also adjust your AJAX call to deal with the error:

$http.get('includes/functions/gettrack.php').success(function(data){
    $scope.data = data;
}).fail(function(){
    console.error('AJAX call failed');
});

Alternatively you could change the string being returned within die(), but I would advise that this is not really a good way to fix it.

die('"Fatal error: service unavailable at this time"');

edited Nov 9, 2017 at 11:43

answered Nov 9, 2017 at 11:29

Jim Wright

6,0681 gold badge18 silver badges35 bronze badges

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

1 Comment

user8781461 Over a year ago

Thank you, this helped I've added your code in! I was so stupid in forgetting "require_once '../../config/db_connect.php';".

score 0 · Accepted Answer · 2017-11-09 11:57:43Z

0

You're missing the connection to the database...

$connect = mysqli_connect($db['hostname'],$db['username'],$db['password'],$db['database']);

edited Nov 9, 2017 at 11:57

answered Nov 9, 2017 at 11:48

user5631312

Collectives™ on Stack Overflow

Displaying data from a database using Angularjs

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related