Guide for accessing the same th element in all objects within nested Json loops

My Json object contains 4 children: Item, Column 1, Column 2, and Column 3.

    {
Item: {0: "PD", 1: "1 - Processor Intel Xeon E5-2630", 2: "2 - Additional 
    Processor", 3: "3 - Memory Quantity Increase", 4: "4 - Raid 6 H730/H730p Cabled Chassis", 5: "5 - Hard Drive Quantity Increase", 6: "6 - Perc H730 Raid Controller 1GB", 7: "7 - UEFI BIOS Boot", 8: "8 - Support: ProDeploy", 9: "9 - Hard Drive Support 3 years", 10: "10 - Dell Networking N2024P Switch", 11: "11 - N2024P Switch  - 5 Years Support", 12: "12 - N2024P Switch - Pro Deployment L2 N"},
    Column 1: {0: 0.2, 1: 0.64, 2: 0.67, 3: 0.63, 4: 0.65, 5: 0.74, 6: 0.64, 7: 0.65, 8: 0.63, 9: 0.65, 10: 1.02, 11: 0.71, 12: 0.7},
    Column 2: {0: 0.24, 1: 0.7, 2: 0.69, 3: 0.7, 4: 0.69, 5: 0.79, 6: 0.69, 7: 0.68, 8: 0.67, 9: 0.68, 10: 1.05, 11: 0.74, 12: 0.72},
    Column 3: {0: 0.199, 1: 0.665, 2: 0.652, 3: 0.631, 4: 0.644, 5: 0.698, 6: 0.647, 7: 0.637, 8: 0.622, 9: 0.63, 10: 0.997, 11: 0.698, 12: 0.672}
    }

I'm looking to extract the column name (object name) and access the th element for all objects during an orchestrate mode operation. For example:

Item: PD | Column 1: 0.2 | Column 2: 0.24 | Column 3: 0.199

Item: 1 - Processor Intel Xeon E5-2630 | Column 1: 0.64 | Column 2: 0.7 | Column 3: 0.665

Note that the names of Column 1, Column 2, and Column 3 are dynamic and can vary when creating this jSon object.

Additional Information:

Using Javascript, I attempted to loop through the first object and fetch the corresponding position cell values for other objects. However, due to the dynamic nature of object names, I am unsure how to proceed.

i = 0
for (column in dfJson){         
    if(i == 0){
        for (item in column){
           console.log(dfJson['Item'][dfJson[obj][item]]); //here I have the value for the first object "Item" in this iteration
            //I need to retrieve the value for Column 1 in the same position
            //I need to retrieve the value for Column 2 in the same position
            //I need to retrieve the value for Column 3 in the same position
}i++;}}

Answer №1

To dynamically access the properties, you can utilize the Object.keys method. This allows you to loop through your first property and match the values from the other properties accordingly. For example, PD -> 0.2, 0.24, 0.199

const dfJson = {
Item: {0: "PD", 1: "1 - Processor Intel Xeon E5-2630", 2: "2 - Additional Processor", 3: "3 - Memory Quantity Increase", 4: "4 - Raid 6 H730/H730p Cabled Chassis", 5: "5 - Hard Drive Quantity Increase", 6: "6 - Perc H730 Raid Controller 1GB", 7: "7 - UEFI BIOS Boot", 8: "8 - Support: ProDeploy", 9: "9 - Hard Drive Support 3 years", 10: "10 - Dell Networking N2024P Switch", 11: "11 - N2024P Switch  - 5 Years Support", 12: "12 - N2024P Switch - Pro Deployment L2 N"},
    "Column 1": {0: 0.2, 1: 0.64, 2: 0.67, 3: 0.63, 4: 0.65, 5: 0.74, 6: 0.64, 7: 0.65, 8: 0.63, 9: 0.65, 10: 1.02, 11: 0.71, 12: 0.7},
    "Column 2": {0: 0.24, 1: 0.7, 2: 0.69, 3: 0.7, 4: 0.69, 5: 0.79, 6: 0.69, 7: 0.68, 8: 0.67, 9: 0.68, 10: 1.05, 11: 0.74, 12: 0.72},
    "Column 3": {0: 0.199, 1: 0.665, 2: 0.652, 3: 0.631, 4: 0.644, 5: 0.698, 6: 0.647, 7: 0.637, 8: 0.622, 9: 0.63, 10: 0.997, 11: 0.698, 12: 0.672}
};

for (column in dfJson.Item){
    const currentKey = Object.keys(dfJson.Item)[column];
    // dfJson.item[column] -> Value of Item at current column
    console.log(dfJson.Item[column]);
    for (row in dfJson) {
        if (row !== 'Item') {
           // dfJson[row][currentKey] -> Value of dynamic Key that is not Item at current column
           console.log(dfJson[row][currentKey])
        }
    }
}

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

Create a PDF and excel sheet, with the excel sheet having neither the ability to open nor the option to save similar to how it is done in Laravel

Is there a way to create an Excel sheet in Node.js that can be opened directly or saved to the system, without saving it in the project directory? Generating Excel Sheet exports.excel = function (req, res) { var fs = require('fs'); var e ...

ESLint version 8.0.0 encountered an error while attempting to fetch the '@typescript-eslint' plugin

Hey there, I'm in need of some assistance. I encountered an error while trying to build a project. Uh-oh! Something didn't go as planned! :( ESLint: 8.0.0 TypeError: Failed to load plugin '@typescript-eslint' specified in ' ...

Transferring information between container and component with Meteor React

I'm facing a challenge with passing data from a container to a component in the context of Meteor and React. Despite following the steps in the Meteor React tutorial and making some customizations, the code doesn't seem to be working as expected. ...

Discovering the root cause of why a particular CSS style is not being implemented correctly

Currently, I am in the process of developing a secondary theme for one of my websites. It's going to be a dark theme. I'm facing an issue where a specific CSS style is not being applied to a particular element, even though it works perfectly fine ...

Locate an available space in a List of Objects to accommodate a schedule in Java

I am currently developing a Java app that aims to display a detailed schedule of a shop, including information about when people enter and exit, as well as identifying periods when there are no visitors present. Please refer to the image attached for refer ...

Implementing universal design in Next.js 14

I'm encountering a problem while trying to use the style jsx global property in the latest version of Next.js. Previously, you would include it in the _app.js file, but since that file no longer exists, I assumed it should be added to the layout.tsx f ...

Use Tinymce to incorporate style_formats from an external source, such as a link_list

I'm attempting to load style formats from an external source, similar to how I do for link_list. However, the method that works for link_list doesn't seem to work for style_formats. Despite trying various solutions listed below, I haven't be ...

Having trouble loading a model with GLTFLoader in Vue2

I am utilizing GLTFLoader to import a model into my Vue2 application. My implementation follows the standard Three.js template. I directly copied the GLTFLoader code from the Three.js documentation. Despite creating a simple example, I am facing difficulti ...

Is the each() method in jQuery essentially a for loop?

Experimenting with adding a serialized class to a group of objects, I attempted the following approach: jQuery('#preload img').each(function(){ jQuery('#thumbs').append('<img class="index' + index + '" src="&apos ...

Tips for overriding ng-disable in AngularJSUnleashing the

This is a comment box using AngularJS: <tr> <td colspan="5"><br/>Comments* <div><textarea class="form-control" rows="3" cols="60" ng-model="final_data.drc_scope" placeholder="Add comments here" ng-disabled="is_team==0 || isDis ...

The issue with calling Ajax on button click inside a div container is that the jQuery dialog box is

Here is the code for my custom dialog box: $("#manageGroupShow").dialog({resizable: false, draggable: false, position:['center',150], title: "Manage Group", width:"50%", modal: true, show: { effect:"drop", duration:1000, direction:"up" }, hide: ...

Trouble arises when attempting to use JavaScript, JSP, and JSON in conjunction with

I am in the process of creating a client-server application where I send a request from the client to the server using a JSON object for registration. However, despite receiving a JSON response with an "OK" field as expected, the client keeps triggering th ...

Unable to invoke a function within a JavaScript class

As I develop a THREE.js graphics program, I am looking to create a BodyPart class in Javascript that includes various methods. However, I have encountered an issue where I am unable to successfully call these methods. Despite the code displaying 'call ...

Understanding the behavior of a React component when passed as a prop

Typically, components are passed down as children to another component. However, I have noticed in some UI libraries that components can also be passed using standard named props. I attempted this approach myself but encountered some limitations without an ...

Incrementing values in ng-repeat object automatically

My project involves extracting game information from mlb.com and utilizing angularjs along with the ng-repeat directive to display it. A sample of the JSON feed is shown below. { "data": { "games": { "next_day_date": "2017-08-19", "mo ...

The significance of documenting and optimizing code execution

My coding practice is to always (or at least try to) add comments to my code. However, I have set up my server to delete those comments and extra white space before the final delivery. Should I omit comments from the live system's code (Javascript/php ...

Create a visual representation using a push button

Hey there, I'm attempting to create an image using a button on canvas. However, I'm facing an issue where I can't draw on the clear canvas. Here's my code: <!doctype html> <html> <head> <meta charset="utf-8"> ...

How to deal with jQuery's set val() behavior on SELECT when there is no matching value

Let's say I have a select box like this: <select id="s" name="s"> <option value="0">-</option> <option value="1">A</option> <option value="2" selected>B</option> <option value="3">C</option> </ ...

Unable to retrieve JSONField data in Django templates

I am having trouble accessing data from a jsonfield in the template. I attempted the following code snippet: {% for key in place.places_to_visit %} {{ key }}:{{ value }} {% endfor %} However, it is displaying all the json data I added, including {} a ...

Issue with ng-true-value in AngularJS version 1.6.1 - not functioning as expected

Recently, I delved into AngularJS and followed an online tutorial that showcased how to utilize ng-true-value and ng-false-value. Here's the snippet: <!DOCTYPE html> <html lang="en"> <head> <script src="https://ajax.googleapis ...