Ways to retrieve a specific Array[property] within an object?

I am struggling to access a specific property within an array of objects. My goal is to extract the "name" elements from the app catalog array, combine them with the names from the custom array apps.name, and assign the result to a new property in the questionnaire object called "appNames". I want to use this new property as a header in the ag-grid. However, I have been unsuccessful in achieving this and feel like I am overlooking something important.

Here is the payload I am working with:

{
    "id": 1,
    "firstName": "test",
    "lastName": "customer",
    "status": 1,
    "accountType": "CUSTOMER",
    "licenseType": "BASIC",
    "questionnaire": {
        "id": 6,
        "companysize": "MICRO",
        "industry": {
            "id": 1,
            "name": "Agriculture and Mining"
        },
        "language": "CZ",
        "appCatalog": [
            {
                "appIdToSearch": 6,
                "appNameDefault": "SECURITY PLUS"
            },
            {
                "appIdToSearch": 121,
                "appNameDefault": "New logo test CZ"
            }
        ],
        "customApps": [
            {
                "id": 16,
                "name": "asd",
                "enabled": false
            },
            {
                "id": 49,
                "name": "aaaaaa",
                "enabled": false
            }
        ]
    }
}

and here is the code where I am trying to access other properties of the object:

{
  headerName: 'First Name',
  field: 'firstName',
  sortable: true,
  filter: true,
  checkboxSelection: true,
  editable: true,
  resizable: true,
},
{
  headerName: 'Last Name',
  field: 'lastName',
  sortable: true,
  filter: true,
  editable: true,
  resizable: true,
},
{
  headerName: 'Email',
  field: 'email',
  sortable: true,
  filter: true,
  editable: true,
  resizable: true,
},
{
  headerName: 'Phone',
  field: 'phone',
  sortable: true,
  filter: true,
  editable: true,
  resizable: true
},
{
  headerName: 'Employee Count',
  field: 'questionnaire.companysize',
  sortable: true,
  filter: true,
  editable: false,
  resizable: true
},
{
  headerName: 'Industry',
  field: 'questionnaire.industry.name',
  sortable: true,
  filter: true,
  editable: false,
  resizable: true
},
{
  headerName: 'Language Preference',
  field: 'questionnaire.language',
  sortable: true,
  filter: true,
  editable: false,
  resizable: true,
},
{
  headerName: 'Apps I am using',
  field: 'AppNames',
  sortable: true,
  filter: true,
  editable: false,
  resizable: true
},

The last one, the "Apps I am using" field, is the one that is causing me trouble.

I am trying to populate this field with the values from appCatalog.appNameDefault and customApps.name, formatted as AppNames = appCatalog.appNameDefault + customApps.name. Unfortunately, I have been unable to make it work. Any assistance would be greatly appreciated!

Answer №1

If you're looking to retrieve the name of your custom application, you can use the following code snippet:

yourObject.questionnaire.appCataloge[0].forEach((item,index)=>{
    // Perform actions with each item here...
    item.appNameDefault  = item.appNameDefault+' '+yourObject.questionnaire.customApps[index].name;
});

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

Diverse Browser Outcomes with jQuery CSS

Currently, I am in the process of developing an app that utilizes percentages as offset positions for ease of calculation. For a visual example, you can visit this link: http://jsfiddle.net/WeC9q/1/embedded/result/ Although the zooming feature functions ...

The specified package, [email protected], fails to meet the peerDependencies criteria set by its sibling modules

Encountering errors when attempting to run npm install. I'm puzzled why it's not working despite using the most recent version of React. npm ERR! peerinvalid The package <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail ...

Bringing in an SVG file as a React component

When importing an SVG into React as a Component, I am facing an issue where the CSS classes are wrapped in style tags, causing an error upon import. Removing the CSS from the style tags allows the SVG to load, but it loses its additional styling. I want t ...

Making a Zoom effect using p5.js

I have searched for a solution to this question multiple times, but none of the answers I came across seem to work for me. Currently, I am able to allow the user to scale an image with a simple scale(factor) call. However, now I am attempting to implement ...

Determining the Existence of Duplicates in an HTML Table with Multiple Inputs Using JavaScript

After spending countless hours on research with no luck, I've finally come to seek assistance from you. In my form, I have an input field and a select field, along with a table generated using PHP from my database that displays team names and their r ...

Having trouble implementing new controllers in AngularJS UI-Router for nested states?

I'm currently facing an issue with nested states in the ui-router. My task involves rendering a page that includes regions, countries, and individuals per country. In the index.html file, there are three regions represented as links: EMEA, APAC, and ...

Utilizing C# ASP.NET to Extract Data from a Web Page Post JavaScript Execution

Looking to extract all links from a web page in order to review where cookies are being set for compliance with UK legislation. In an effort to streamline the process, I am exploring automation options to save time. However, a challenge I am facing is tha ...

What is the best way to skip certain steps within a Promise using Bluebird?

Here is an example of some code: Queues.findOne({_id: id}) .then(function(q) { var status = q.status; //... }).then(function(q) { // A }).then(function(q) { // B }).then(function(q) { // C }).then(function(q) { // D }).then(function(q) { // E }).then ...

What is the best way to determine the number of dimensions in a JavaScript array?

Take a look at this array and its corresponding expected output: In Javascript, is it possible to dynamically determine how many levels there are in the array ary? var ary = ["a","b",["c","d"],"e",["f","g",["h","i"],"j"]]; Output: 3 var ary = ["a","b",[" ...

Three.js globe experiencing issues with splines arc functionality

I have been experimenting with mapping arcs around a three.js globe, following some examples. I am close to getting it to work but I am struggling with the calculations and the resulting projection appears to be incorrect. If anyone could review my code an ...

The process of running npx create-react-app with a specific name suddenly halts at a particular stage

Throughout my experience, I have never encountered this particular issue with the reliable old create-react-app However, on this occasion, I decided to use npx create-react-app to initiate a new react app. Below is a screenshot depicting the progress o ...

Strategies for Returning Multiple Values from a Function in JavaScript

Thanks in advance I am wondering how to extract multiple values from a code block using JavaScript. I am unsure if I need to use an array or something else as I am new to JS. Please consider the following HTML code: <div class="row"> ...

Using an image as the background for a three.js scene may cause it to appear distorted

I am struggling with setting an image as a background for my scene without it becoming blurry. I have attempted to use the following code: textureLoader.load("images/background/space.png", function(t) { scene.background = t; }); The problem arises when ...

Modify the data displayed on the chart by choosing the desired year from the dropdown options

In my Angular app, I am showcasing a chart that visualizes data based on selected starting and ending years from dropdown menus. The X axis represents 18 cities, while the Y axis displays "IAP" values. To calculate the "IAP" values for each city within the ...

Using JavaScript to store CSS style properties in an array

In the midst of building a React-datagrid project, I am streamlining CSS properties for an array. However, there seems to be redundant CSS properties that I would like to consolidate into an array format. let _columns = []; let commonStyle = {"width":"20 ...

Exploring Highcharts Pie Chart with AJAX for Real-time Data Updates

Looking for some guidance with implementing AJAX in my code to make my chart dynamic based on data from the database. Although the code is error-free, the chart is not refreshing automatically. Any help, comments, or suggestions would be greatly appreciate ...

Tips for sending API requests as an object rather than an array

Hello there! I'm having trouble posting the data as an object. I attempted to adjust the server code, but it keeps throwing errors. Here is a snippet of the server code: const projectData = []; /* Other server setup code */ // GET route app.get(&a ...

Troubleshooting Routing Issues in a Next.js Website Tutorial

After going through the next.js tutorial at https://github.com/zeit/next-learn-demo.git, I encountered an issue starting from stage 3 "dynamic routing". Despite the tutorial indicating that dynamic routing should be working from stages 3 to 8, it wasn&apos ...

Unlocking the npm package event emitter on the client side in Meteor

Having some trouble with a seemingly basic issue. I came across an NPM package called LOG-WATCHER (used as an example) which keeps an eye on a specific log file on a client's local file system. This package emits events such as 'START', &apo ...

Svelte Material UI Circular Progress Indicator encountering issues

I'm having trouble getting the Svelte Material UI Circular Progress indicator to function properly. I attempted to implement it in my project initially, and then decided to try it out in Code Sandbox using the provided code from the documentation. How ...