return json data from mysql into angular file - works from a text file, but not from php

Question

Very new to angular - just exploring at the moment. Would be very grateful for a pointer or two as to where I am going wring here - TIA

What I would like to do is take data from a mysql select query and return it into an html page, using json and then have angular to display it. Have succeeded in returning the data using JSON_encode - ran it through jsonlint and it has come back as fine. For testing, I then took this string and created a text file, and ran it through the angular file - it works fine.

If I call the data direct from the php file it fails, but if I call the data from a static text file (with what appears to be the same output as the php data) it works.

I am sending the data with echo - is this correct?

$json=json_encode($main_arr); 
echo $json;

json output:

[{"custcode":"CMZIG001","cli":"0020\/1"},{"custcode":"CMZIG002","cli":"0020\/2"},{"custcode":"CMZIG003","cli":"0020\/3"},{"custcode":"999","cli":"002871365801"},{"custcode":"CMSLE001","cli":"0030"},{"custcode":"CMNIC001","cli":"0034"},{"custcode":"CMLIF001","cli":"0047"},{"custcode":"CMTON01101","cli":"0087\/1"},{"custcode":"CMTON01102","cli":"0087\/2"},{"custcode":"CMTRE001","cli":"0090"}]

Text file contents:

[{"custcode":"CMZIG001","cli":"0020\/1"},{"custcode":"CMZIG002","cli":"0020\/2"},{"custcode":"CMZIG003","cli":"0020\/3"},{"custcode":"999","cli":"002871365801"},{"custcode":"CMSLE001","cli":"0030"},{"custcode":"CMNIC001","cli":"0034"},{"custcode":"CMLIF001","cli":"0047"},{"custcode":"CMTON01101","cli":"0087\/1"},{"custcode":"CMTON01102","cli":"0087\/2"},{"custcode":"CMTRE001","cli":"0090"}]

In response to comments:

OK - I had hoped not to bore you with my code. An html file as below (I will try to format it correctly)

<!doctype html>
<html ng-app="App">
<head>
    <meta charset="utf-8">
    <title>CLIs http</title>
    <link rel="stylesheet" href="style.css">
    <script>document.write("<base href=\"" + document.location + "\" />");</script>
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js">      
</script>
    <script src="app.js"></script>

</head>

<body ng-controller="TodoCtrl">
    <ul>
        <li ng-repeat="cli in cli">
            {{cli.custcode}} - <em>{{cli.cli}}</em>                
        </li>
    </ul>

</body>
</html>

app.js - currently set to call a php file on my server

var App = angular.module('App', []); 

App.controller('TodoCtrl', function($scope, $http) {

 $http.get('http://localhost/t5/clis.json')
 //$http.get('njs.json') 

.then(function(res){

$scope.cli = res.data;

});

});

clis.json (the php file on my server)

$con = mysql_connect("localhost","root","password");
if (!$con)
  {
die('Could not connect: ' . mysql_error());
}
$db='mutuxf';
mysql_select_db($db, $con);

$result = mysql_query("SELECT custcode, cli  FROM clis limit 10");


 while($row = mysql_fetch_assoc($result))
{   
foreach($row as $key => $value)
{    $arr[$key] = $value; }

$main_arr[] = $arr;
}
 $json=json_encode($main_arr); 
 echo $json;


?>

When I use the php file to raise the data, I merely get a bulleted list with no text, but when I use the text file (njs.json) the page works correctly.

So what fails? Can you show you angular code s=indicating how you are trying to consume this data? — Mike Brant
– Mike Brant, Commented Jan 15, 2013 at 16:53
When I use the text file (njs.json), the data shows up perfectly, and when I use the file on localhost as below, it just shows new lines (about 400 of them!): I call app.js from within the html file app.js reads: var App = angular.module('App', []); App.controller('TodoCtrl', function($scope, $http) { $http.get('localhost/t5/clis.json') //$http.get('njs.json') .then(function(res){ $scope.cli = res.data; }); }); — Chris Dav
– Chris Dav, Commented Jan 15, 2013 at 17:10
the way you present the problem it must work, hence the question needs more information. — akonsu
– akonsu, Commented Jan 15, 2013 at 17:30
inside your "then" function, dump the res variable to the console to see what is there. in other words, try to debug it. — akonsu
– akonsu, Commented Jan 15, 2013 at 18:51

Nuriel · Accepted Answer · 2013-01-15 18:43:44Z

1

firstly, i would recommend switching from .then() to .success() and .error(), so you know if all is going well.

other than that, since the question information is lacking and quite general, i would bet that the json fetching and building part on the server is the problem. maybe this link would help

the way they fetch it:

$data = file_get_contents("php://input");
$objData = json_decode($data);

pay attention to the comment, it might be key here:

// The request is a JSON request.
// We must read the input.
// $_POST or $_GET will not work!

in general- if you have the option to add or switch framework on the backend, i would recommend symfony/django for php or switch to RoR with RABL/GON to generate the jsons. it's so much easier and intuitive. hope it helps, it's been a while since i used vanilla php.

answered Jan 15, 2013 at 18:43

Nuriel

3,7513 gold badges25 silver badges24 bronze badges

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

1 Comment

Chris Dav Over a year ago

This seems to have put me on track I changed the file name extension to php - instead of json, and voila - it works. Do not have a clue why, but as you suggested - the json was not coming across correctly. Hope this helps someone, and than you to all for your help.

sgraham785 · Accepted Answer · 2013-12-28 07:28:53Z

0

It's becauce you can not run php in a .json file, clis.json needs to be clis.php or you can have the php script write to a separate json file, which would hold the data

answered Dec 28, 2013 at 7:28

sgraham785

1

Collectives™ on Stack Overflow

return json data from mysql into angular file - works from a text file, but not from php

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