JSON data with AngularJS from PHP connecting to SQL

Question

connect.php

<?php
   $host        = "host=127.0.0.1";
   $port        = "port=5432";
   $dbname      = "dbname=Northwind";
   $credentials = "user=postgres password=qwer1234";

   $db = pg_connect( "$host $port $dbname $credentials"  );

    $sql =<<<EOF
      SELECT * from customers;
EOF;

   $ret = pg_query($db, $sql);
   if(!$ret){
      echo pg_last_error($db);
      exit;
   } 
   $rows = array();
   while($r = pg_fetch_assoc($ret)){
      $rows[] = $r;
      echo json_encode($rows);
   }
?>

JSON

[{"CustomerID":"ALFKI","CompanyName":"Alfreds Futterkiste","ContactName":"Maria Anders","ContactTitle":"Sales Representative","Address":"Obere Str. 57","City":"Berlin","Region":null,"PostalCode":"12209","Country":"Germany","Phone":"030-0074321","Fax":"030-0076545"}][{"CustomerID":"ALFKI","CompanyName":"Alfreds Futterkiste","ContactName":"Maria Anders","ContactTitle":"Sales Representative","Address":"Obere Str. 57","City":"Berlin","Region":null,"PostalCode":"12209"...........

AngularJs.html

<html ng-app="myApp">
<head>
    <title></title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body>
    <div ng-controller="customersCtrl"> 
        <div>
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>CustomerID</th>
                        <th>CompanyName</th>
                        <th>ContactName</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="item in customers">
                        <td>{{item.CustomerID}}</td>
                        <td>{{item.CompanyName}}</td>
                        <td>{{item.ContactName}}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</html>
<script>

var app = angular.module("myApp", []);

app.controller('customersCtrl', ['$scope', '$http', function($scope,$http) {
   console.log("Initiating the controller");
   $http.get('http://localhost:8080/connect.php').success(function(data) {
    $scope.customers = data;
    });
}]);
</script>

The result of this is that nothing shows up on angularjs.html Help Me! Thanx.

Try console.log() data from the .get, and also $scope.customers to check how the result is assigned — Tristan
– Tristan, Commented Nov 21, 2015 at 21:08
XMLHttpRequest cannot load localhost:8080/connect.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. — ooz
– ooz, Commented Nov 21, 2015 at 21:16
Thank you add code header("Access-Control-Allow-Origin: *"); header("Content-Type: application/json; charset=UTF-8"); done. — ooz
– ooz, Commented Nov 21, 2015 at 21:19

ooz · Accepted Answer · 2015-11-21 21:16:30Z

0

Initiating the controller

XMLHttpRequest cannot load http://localhost:8080/connect.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

answered Nov 21, 2015 at 21:16

ooz

551 silver badge7 bronze badges

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

Collectives™ on Stack Overflow

JSON data with AngularJS from PHP connecting to SQL

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related