I must extract the internal data from the JSON reply

My code successfully retrieves JSON responses from the server.

Here is the Javascript Code :

$http({
    method: 'POST',
    url: 'http://***SOMEURL',
    headers: { 'Content-Type': 'application/json', 'Accept': 'application/json'},
    data: JSON.stringify(data)   
})
.then(function (response) {
    $scope.myData = response.data;
    $scope.myData1=response.data.message.connectionDetailses;
});

The response returned is as follows:

{
    "code": 100,
    "message": {
        "id": 29020,
        "customerCode": "730",
        "name": "John P. M.    168",
        "lastName": "X",
        "houseName": "Hosuseahjkahsh",
        "address1": "1",
        "address2": "x",
        "address3": "wehwhkjwh P. O.",
        "postalCode": "686011",
        "email": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="9aababdaababb4f9f5f7">[email protected]</a>",
        "phone": "1234567890",
        "mobile": "1234567890",
        "operatorName": "abcd ",
        "connectionDetailses": [
            {
                "customerCode": "730",
                "accountId": 5,
                "dueAmount": 0,
                "connectionId": 27203,
                "accountName": "M S"
            },
            {
                "customerCode": "730",
                "accountId": 5,
                "dueAmount": 2000,
                "connectionId": 116303,
                "accountName": "MS"
            },
            {
                "customerCode": "730",
                "accountId": 9,
                "dueAmount": 0,
                "connectionId": 116303,
                "accountName": "Connection"
            },
            {
                "customerCode": "730",
                "accountId": 14,
                "dueAmount": 0,
                "connectionId": 116303,
                "accountName": "Amc"
            }
        ]
    }
}

I am looking to display connection details based on connectionId within a single block, instead of all at once.

{
                "customerCode": "730",
                "accountId": 9,
                "dueAmount": 0,
                "connectionId": 116303,
                "accountName": "Connection"
}

Answer №1

To retrieve connection details for a specific connectionId, you can use the following code:

const connectionId = 116303;
const connectionDetail = response.data.message.connectionDetailses.find(detail => detail.connectionId === connectionId);
console.log(connectionDetail);

If you need to fetch all details associated with the same id, you can utilize array.filter method like so:

const connectionId = 116303;
const connectionDetails = response.data.message.connectionDetailses.filter(detail => detail.connectionId === connectionId);
console.log(connectionDetails);

Answer №2

It seems that using Array#filter could help in isolating the connections with the specific id required. Here's a possible implementation:

const relevantConnection = response.data.message.connectionDetailses
  .filter(connection => connection.connectionId === 116303)[0]

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

A guide on verifying the availability of the font-face feature using JavaScript

Can JavaScript be used to determine if the font-face feature is supported? ...

Compel the browser to launch a fresh tab

I'm currently working on an app that involves uploading files. One issue I'm facing is that the file system pop up doesn't close after the upload, causing a quarter of the screen to be covered while the test keeps running in the background. ...

Python Bot for Discord: Elevating Interactions with EXP Levels

Currently, I am working on a Discord bot using Python and have implemented a level system. Although it is mostly functional, I am facing two main issues. The leveling up process seems to be happening too quickly, and the system is also counting bots and w ...

What is the process for turning off caching in CORS-Anywhere?

Encountering an issue with CSRF token validation while making a POST request to an endpoint on a different server using cors-anywhere. The error occurs because the CSRF Token passed to the cors-server is cached, leading to validation failure. Referenced a ...

Iterate over a collection of JSON objects and dynamically populate a table with statistical data

In JavaScript, I am trying to dynamically generate a table with statistical data from an API that contains an array of JSON objects. The JSON data has a property called "score" which is interpreted as follows: score: 5 (excellent); score: 4 (very good); ...

What is the proper way to call document methods, like getElementByID, in a tsx file?

I am currently in the process of converting plain JavaScript files to TypeScript within a React application. However, I am facing an error with document when using methods like document.getElementById("login-username"). Can you guide me on how to referen ...

Retrieve data from an external .json file and showcase it on an HTML page

I need to find a way to retrieve data from an external .json file and present it on a webpage using html. Below is the json content: { "jobid": "2018-1109", "overview": "hello world", "links": [ { "rel": "self", "title": "hello world" } ] ...

Items outside the container element

I recently noticed an issue with my website, which is built using Bootstrap. The problem arises when users scroll down the page and encounter the fixed navigation menu. It appears that the menu items and logo are no longer contained within the designated ...

Issue with $cookies not functioning properly in Angular 1.4.2 version

Having trouble with Angular and injecting $cookies into a controller. The $cookies work fine in a service, but encountering issues in this specific controller. var app = angular.module('app', [ "ui.router", "ngCookies", 'ui.boo ...

jQuery Autocomplete - struggling to pinpoint the exact location where the width of the suggestions div is being defined

I have successfully implemented jQuery Autocomplete, but I am facing an issue with adjusting the width. Currently, it is set to 268px in Firebug, however, I would like it to be 520px. After checking the stylesheet, I couldn't locate where the width o ...

Combining two request.get functions into a single one

Is there a way to combine these two functions into one? I have two APIs: /page1 and /page2. My goal is to merge the two arrays into one because the GitHub API only displays 100 objects per page. request.get({ url: 'https://api.github.com/users/an ...

Guide to Implementing Ajax Calls with JavaScript

What I am looking for: I need to send an AJAX call using JavaScript. I have utilized jQuery for the AJAX call. jQuery Code: var mobile = $("#mobiledropdown".attr("value"); url = window.location.href.indexOf("?") > -1 ? document.URL + "&asyn=1" : ...

How can I iterate through XML nodes using JavaScript?

I attempted to iterate through list items from an XML file using JavaScript. However, the list data is not displaying with bullet points. Below is my code: Data.xml <?xml version="1.0"?> <paintings> <cd> <para>posuere lacus in, ...

AngularJs - Dynamically disable input fields in table based on the selection in the top row

Is there a simple way to disable input elements in tables below the top row if certain boolean values are set to true, without losing their data? I want users to be able to edit those rows again if the booleans are set to false. Can AngularJs help with thi ...

Cookies cannot be used in browsers other than Chrome, nor can HTML5 local storage

Currently, I am developing a javascript tool that is designed to save a user's selections locally and then reload them when the page is revisited. While this feature works perfectly in Chrome, it seems to be non-functional in IE8 and Safari. I have e ...

Trouble with mobile compatibility for .json file content population in HTML elements script

Check out THIS amazing page where I have a series of placeholders for phone numbers in the format: 07xxxxxxxx. By simply clicking the green button "VEZI TELEFON", each placeholder in the green boxes gets replaced with a real phone number from a JSON file u ...

When using next.js, a warning may be encountered that states: "A value of NaN was received for the `children` attribute. To resolve this, ensure the value is cast as

I am currently tackling my first Next.js project and have created a file called myCart.js. Below is the code snippet: function orderCard(arr1) { //Code here... } let noRefresh; function makeGetRequest() { //Code here... } export default makeGetReques ...

Prevent anchor jumping caused by popstate event in Safari

This situation is really testing my patience. When navigating within the same page using anchors, the browser automatically takes you back/forward to the location of that link in your history when popstate is triggered. One might think that you could prev ...

Enhancing Your WordPress Menu with Customized Spans

I have a WordPress menu structured like this: <div id="my_custom_class"> <ul class="my_custom_class"> <li class="page_item"><a href="#">page_item</a> <ul class='children'> <li class="page_item chil ...

How can I manipulate the scope value of an Angular dropdown menu using the console?

Is there a way to modify the value in a dropdown menu implemented in AngularJS using the Developer Tools Debugger? I attempted the following code: angular.element( getElementsByClassName('input-group ng-pristine ng-isolate-scope ng-empty ng-inva ...