AngularJS to Mysql

Question

I must be missing something... because I'm really a noob at this.

I have this angularjs data:

$scope.todoList = [
      { text: 'Check me out' },
      { text: 'Lorem ipsum dolor sit amet, possit denique oportere at his, etiam corpora deseruisse te pro' },
      { text: 'Ex has semper alterum, expetenda dignissim' },
    ];

And I wanted to put it in a mysql table instead. I created the table and then tried to get table data:

JS:

$http({method:'POST',url:'process.php'})
          .then(
            function successCallback(response) { $scope.todoList = response.data;}, 
            function errorCallback(response) {$scope.todoList = "ERROR!";});

PHP:

    $sql = "SELECT * from `todolist`";
    $result = $conn->query($sql);
    $data = array();
    while ($row = mysqli_fetch_assoc($result)) {
        $data[] = array("text" => $row['text']);
    }
    echo json_encode($data);

When I manually try the PHP the output is:

[{"text":"Check me out"},{"text":"Lorem ipsum dolor sit amet, possit denique oportere at his, etiam corpora deseruisse te pro"},{"text":"Ex has semper alterum, expetenda dignissim"}]

Does someone know where the problem is?

Your response data type is not valid json data type, and assigns response-string without parsing to $scope.todoList; use JSON.parse(response.data) — MohaMad
– MohaMad, Commented Mar 11, 2017 at 22:28

Community · Accepted Answer · 2017-05-23 12:25:20Z

0

I think your problem is about reading and assigning value of response data; so I've commented:

Your response data type is not valid json data type, and assigns response-string without parsing to $scope.todoList; use JSON.parse(response.data)

and suggest these topics (maybe helpful):

If you have problem with Updating after AJAX call:

Comments

Rui Silva · Accepted Answer · 2017-03-11 23:07:44Z

0

I tried JSON.parse(response.data) but no success. I'll try to elaborate a bit more:

This code worked fine:

function getRandomColor() {
  var i = Math.floor(Math.random() * (colors.length - 1));
  return colors[i];
}

$scope.todoList = [
  { text: 'Check me out' },
  { text: 'Lorem ipsum dolor sit amet, possit denique oportere at his, etiam corpora deseruisse te pro' },
  { text: 'Ex has semper alterum, expetenda dignissim' },
];

$scope.todoList.forEach(function(item) {
  item.color = getRandomColor();
});

But now this one gives an error in console:

TypeError: Cannot read property 'forEach' of undefined

function getRandomColor() {
  var i = Math.floor(Math.random() * (colors.length - 1));
  return colors[i];
}

$http({method:'POST',url:'process.php',data:{function: "todolist"}})
          .then(
            function successCallback(response) {$scope.todoList = response.data;}, 
            function errorCallback(response) {console.log("ERROR!");});

$scope.todoList.forEach(function(item) {
  item.color = getRandomColor();
});

It seems like it doesn't wait for the ajax results... But I don't really know.

SOLVED putting foreach function inside successCallback function.

edited Mar 11, 2017 at 23:07

answered Mar 11, 2017 at 22:45

Rui Silva

12 bronze badges

2 Comments

Rui Silva Over a year ago

Solved putting the forEach function inside the successCallback. Thanks everyone!

MohaMad Over a year ago

good edit and How to wait till the response comes from the $http request, in angularjs?

Collectives™ on Stack Overflow

AngularJS to Mysql

2 Answers 2

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related