Retrieve items from a JSON file using Ionic framework's $http.get method

Issue with Console: SyntaxError: Unexpected token { in JSON at position 119

Xcode controller:

 str="http://www.website.com/user-orders.php?e="+$scope.useremail;
 $http.get(str)
   .success(function (response){
     $scope.user_orders = response;
     sessionStorage.setItem('userorders_id', $scope.user_orders.id);

     $scope.orders = [
       {  id:  $scope.user_orders.id, 
          uniqueid:   $scope.user_orders.uniqueid,
          platenumber: $scope.user_orders.platenumber,
          paymentstatus: $scope.user_orders.paymentstatus,
          orderstatus: $scope.user_orders.orderstatus 
       }
     ];
    }).error(function() {
      var alertPopup = $ionicPopup.alert({
        title: 'Failed to get orders!',
        template: 'Please check your credential'
      });
    });

JSON data:

{"records":{"id":"21","uniqueid":"42803122423","platenumber":"00000","paymentstatus":"Success","orderstatus":"Queued"},{"id":"22","uniqueid":"428032438","platenumber":"00000","paymentstatus":"Success","orderstatus":"Queued"},} 

Template layout:

<ion-content ng-controller="orderslistCtrl">


      <ion-list>
          <ion-item ng-repeat="order in orders" href="#/app/orderslist/{{order.id}}">
         {{order.id}}
            {{order.uniqueid}}
          </ion-item>
      </ion-list>
 </ion-content>

When only 1 item is present in "records":

{"records":{"id":"21","uniqueid":"42803122423","platenumber":"00000","paymentstatus":"Success","orderstatus":"Queued"}} 

Result will display only 1 item. If multiple records are loaded, it leads to an error.

Answer №1

Your JSON file may have been incorrect due to the structure you used, where {records:{}} was being treated as an object key rather than containing records:{} in an array format.

{"records":[{"id":"21","uniqueid":"42803122423","platenumber":"00000","paymentstatus":"Success","orderstatus":"Queued"},{{"id":"22","uniqueid":"428032438","platenumber":"00000","paymentstatus":"Success","orderstatus":"Queued"}}]} 

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

You cannot nest a map function within another map function in React

Having some trouble applying the map function in HTML using React. Below is the code snippet: response = [ data : { name: 'john', title: 'john doe', images: { slider: { desktop: 'link1', mo ...

Insert HTML elements into nested CSS classes

My goal is to utilize jQuery for looping through classes and adding text to an HTML element. I am currently working with the following example HTML: <div class="question"> <div class="title"> <strong>Here's the question ...

Obtain a value from a JsonArray and save it in a separate array

Does anyone know how to extract the "score" values from this ArrayofJson dataset? I am looking to store scores 1, 2, 1, 3 in an array like int sample[] = {1, 2, 1, 3}; import org.json.JSONArray; import org.json.JSONObject; p ...

Charts created using Google VisualizationORThe visual representations

My chart is currently not displaying at 100% width as I intended. I would like the chart to span from the beginning to the end of the container. https://i.stack.imgur.com/Xjw6g.png Here's my code snippet: test.controller('testCtrl', [&apo ...

Add a third-party library file to Visual Studio

I'm currently working in Visual Studios and attempting to utilize the library provided at . However, I am encountering difficulties when trying to import the library. I have added the file to the project and attempted to use it within the Book.js (Vi ...

Having trouble sending an ajax request from localhost to a remote server

When attempting to make an ajax request (using jquery) from my local server to a remote page where I am the administrator, I encounter the following error: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin &ap ...

value assigned to ng-model does not update beyond its scope

My issue involves binding an ng-model to an input field. Despite this, the value of the variable it is connected to does not update outside of the specific div where the directive is defined: <div input-field ng-if="startTypes.selected.value == &a ...

Assigning checkmarks to specific tableView rows according to JSON conditions

I need help creating a conditional statement for displaying checkmark accessories in a tableView's records. When certain conditions are met, the checkmark should automatically appear on the appropriate records. This is what I currently have in my ce ...

Track when a user modifies a <select> dropdown list generated using the Jquery method ".html()"

Is it possible to detect a change in the value of a select list when that select list has been added using either the .html(htmlString) or .append(content[,content]) jQuery function? HTML CODE: <ul class="htmlClass"> <!-- Populated via JS --& ...

"Converting an HTML file to a Word file using PHP - a step-by-step

Help needed with converting an HTML file to MS Word using PHP code. Below is the code I am using: include("connection.php"); extract($_REQUEST); ob_start(); include("counties/$county_name/$file"); $html_content = ob_get_contents(); ob_end_clean(); header ...

Conceal Navigation with jQuery

Seeking assistance with jQuery for a new project. I'm trying to create a navigation menu that will automatically disappear after 3 seconds when a user enters the page. In its place, an arrow will be displayed instead of the original menu. Once the a ...

Exploring an alternative perspective on successful login in angular.js

Today was the beginning of my project to convert a website to angular.js. The main page is served by index.html and includes ng-view for other views such as login and signup. Working closely with a backend developer, I have successfully integrated a rest c ...

If the prompt displays 'Monday', then you can output the following days in the console: 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', and 'Sunday'

Could someone assist me with modifying my code so that the entered day is displayed at the end of all days in the console? Currently, it shows up at the top. Here is what I have tried: JavaScript const daysOfWeek = ["monday", "tuesday" ...

Code for retrieving information; some data may not be retrieved

I created a Google Sheets script that iterates through all rows and retrieves API data, then pastes the results in a column all at once. Everything was working fine until I started using the following code snippet instead of referencing a sheet name. var s ...

"Troubleshooting a Stream Problem with the JSON HTTP Module

I have a custom HTTP Module that I utilize to sanitize the JSON response from my web service. This is particularly useful when making cross-domain JSON web service calls from JavaScript. You can check out an example of this implementation at this link. Th ...

Tips for importing a JavaScript file from a URL and initializing a class in a React component

I am looking to incorporate the PitchPrint app into a React website. They offer a tutorial for vanilla HTML/JS integration here. Following their instructions, I included script tags with links to jQuery and their app file in my index.html file. I then crea ...

Updating Data in Node Server using Ionic and Angular

I have developed a Node application that leverages the Twit (Twitter API) to enable my Ionic/Angular Application to post tweets on Twitter. However, I encounter a 404 error message when attempting to set the REST method to Post; it seems to work fine with ...

Converting JAX-RS/JAXB JSON to POJO will only map fields that exist in both the JSON and the POJO, ignoring any additional fields present

In the process of developing an API that must support JSON payloads for PUT/POST requests, which may contain additional fields beyond what is defined in the known POJO. For instance: @XmlRootElement public FruitCounter { int numberOfApples; int num ...

React - Why does React fail to update the state when expected? (not retaining)

Hello there, I'm currently working on fetching JSON data from an API and populating it into a table. It seems pretty straightforward but here's where things get tricky – I can see that the "tableData" state is getting updated as new rows are ad ...

AngularJS Reverse Geocoding Explained

I've been working on implementing reverse geocoding functionality in my Angular project, but so far I've only been able to extract the latitude and longitude coordinates from a location. Unfortunately, every time I try to use the reverse geocodin ...