AngularJS setting JSON string with more then an one set of data to a $scope variable

I have a web service that returns a serialized JSON data string. An example of what is returned is:

{"Campus":"BMSB","Program":null,"Selected":"false","Status":"NEW","Status2":null ,"Status3":null,"StudentID":00000,"StudentFirstName":"Ioneu0027a","StudendMiddle Name":"","StudentLastName":"Byra"}, {"Campus":"BMFW","Program":"Accounting- Diploma","Selected":"false","Status":"GRAD","Status2":"GRAD","Status3":null,"StudentID":00000,"StudentFirstName":"Kathryn","StudendMiddleName":"I","StudentLastName":"Eib"}

two sets of the same data seperated by a comma. now i have this code harded coded in my controller and it loads fine. my code that sets the scope variable.

 soaFactory.getStudent(studentnumber,carslocation)
     .success(function (response){

        if(JSON.parse(response) == "Object reference not set to an instance of an object.")

        {
           //this code will hide any previous student info if a student is not returned
           $scope.noStudentReturned = false;
           $scope.students = null;
           $scope.curStudentFirstName= null;
           $scope.curStudentLastName = null;
           $scope.curStudentSchool= null;
           $scope.curStudentStatus= null;
           $scope.curStudentProgram= null;
        }
        else
        {
         var parsedResponse= JSON.parse(response);
          //alert("parsedResponse :" + parsedResponse );
         //var parsedAgain= JSON.parse(parsedResponse);
        // alert("parseAgain: " + parsedResponse);

         //  $scope.students = [parsedResponse];
         $scope.students = [JSON.parse(parsedResponse)];
         $scope.noStudentReturned = true;
                if ($scope.students.length == 1)
                {
                        //if only one student returned call this function.
                $scope.setStudent(e,0);
                }
                else
                {
                }
        }
     })
     .error(function (error){
           alert(error);              
           $scope.noStudentReturned = false;
           $scope.students = null;
           $scope.curStudentFirstName= null;
           $scope.curStudentLastName = null;
           $scope.curStudentSchool= null;
           $scope.curStudentStatus= null;
           $scope.curStudentProgram= null;

     });

Key Line

             $scope.students = [JSON.parse(parsedResponse)];

debugger just says syntax error. now this code works fine for one set of data. but not more than one.

Please help Thanks joe

The JSON you are returning is invalid. When returning multiple objects like you are you need to return them in an array, not objects separated with a comma. It works with one set of data because you are only sending one object which is valid JSON.

So, to fix this you need to either send the objects back already in an array which is the preferable method. Or you need to parse your response in a way that you can parse each object into it's own string before running json.parse on it and then add it to the array. Bottom line is you are trying to parse invalid JSON.

Your JSON is invalid because it has multiple root elements when you have two objects not enclosed in an array. One object is one root element (valid), two objects are two root elements (invalid), two objects in an array equal one root element (valid). The array is the root element then. Run your JSON through something like http://jsonformatter.curiousconcept.com/ to see the issue first hand.

Your json data will not validate for 2 reasons:

  1. You need to wrap them as an array of objects
  2. Values in JSON string should be quoted.

The truth is you might get away with it in some cases but not if you're dealing with numbers.

So, "StudentID":00000 will never get parsed but "StudentID":"00000" will.

Bottom line: wrap your objects as an array, like nweg said, put quotes to all values and it will get parsed fine.

For example, this gets parsed fine:

   var test = '{"Campus":"BMSB","Program":null,"Selected":"false","Status":"NEW","Status2":null ,"Status3":null,"StudentID":"00000","StudentFirstName":"Ioneu0027a","StudendMiddle Name":"","StudentLastName":"Byra"}, {"Campus":"BMFW","Program":"Accounting- Diploma","Selected":"false","Status":"GRAD","Status2":"GRAD","Status3":null,"StudentID":"00000","StudentFirstName":"Kathryn","StudendMiddleName":"I","StudentLastName":"Eib"}';
   var testparse = JSON.parse( '[' + test + ']' );

And the only thing i changed in your json string was the quotes in a couple of number values.

I have a web service that returns a serialized JSON data string. An example of what is returned is:

{"Campus":"xxxx",...,"StudentLastName":"xxxx"}, {"Campus":"xxxx",...,"StudentLastName":"xxxx"}

This is not a string, these are two json object separated by a comma. Or maybe you forgot to paste the outer quotes.

If your service is likely to return multiple students, which seems the case by looking your code, ensure that you receive as a response objects wrapped in an array. Like that :

Students returned by the service :

[{
    "Campus": "4444",
    "Program": null,
    "Selected": "false",
    "Status": "NEW",
    "Status2": null,
    "Status3": null,
    "StudentID": 00000,
    "StudentFirstName": "somename",
    "StudendMiddle Name": "",
    "StudentLastName": "somename"
},
{
    "Campus": "ssdd",
    "Program": "smith",
    "Selected": "false",
    "Status": "xxxx",
    "Status2": "xxxx",
    "Status3": null,
    "StudentID": 00000,
    "StudentFirstName": "somename",
    "StudendMiddleName": "I",
    "StudentLastName": "somename"
}];

Then in your success handler you'll just have to read this array. Oh, by the way, if you want to check if students are returned or not, please do never ever write something similar :

if (JSON.parse(response) == "Object reference not set to an instance of an object.") {
    // if a student is not returned
}

Now that the students are returned as an array, the test could be simply rewrited as :

if (response.length === 0) {
    // no students
}