Having trouble parsing JSON elements separately

I am currently working on generating data to be utilized in a chart.js plot by utilizing C# Controller and javascript. The Controller method I have returns a JSONResult to a javascript function.

public JsonResult GetPlansPerDoc(){
     //Code to retrieve data from the database
     foreach (RadOnc ro in radOncs){
          pm = new CKPlanTypeDistributionPlotModel()
                {
                    DPName = ro.LastName,
                    DPValue = ro.Plans.Count()
                };

                planList.Add(pm);
            }

            JsonResult data = Json(planList, JsonRequestBehavior.AllowGet);

            return data;
 }

This is the Javascript code that calls the Controller method.

$.ajax({
            type: 'get',
            url: "@Url.Action("GetPlansPerDoc", "HomeData")",
            dataType: 'json',
            success: function (rawData) {
                console.log(rawData);
                const data = rawData.DPName;
                console.log(data);

When I use console.log on the rawData, it displays an Array message in the web console containing the four items in the json result. However, when attempting to access one of the fields of the json result, I encounter an "unknown" error in the web console. How can I properly utilize the json data? ​

Answer №1

Exploring further, I experimented with a different approach. It struck me that accessing rawData[0] would retrieve the initial item. Curious, I tested rawData[0].DPName and was delighted to find it displayed the first name. Therefore, I plan to utilize the subsequent code snippet to extract the necessary elements.

rawData.forEach(dataPoint =>{
     labels.push(dataPoint.DPName);
     values.push(dataPoint.DPValue);
}

I'm open to discovering a more efficient method though.

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

Leveraging OPENJSON in SQL Server Query

I'm facing a challenge with extracting information from a JSON array stored in an SQL Server database. While I understand that the OPENJSON function needs to be used for this task, most examples I've come across focus on declaring a single JSON a ...

How to display nested arrays in AngularJs

Within my array contacts[], there are multiple contact objects. Each of these contact objects contain an array labeled hashtags[] consisting of various strings. What is the best way to display these hashtags using ng-repeat? ...

Is it possible to swap out the content within a <div> element with an external piece of HTML code using JQuery or JavaScript whenever the viewport dimensions are adjusted?

<html> <head> </head> function () { var viewportWidth = $(window).width(); if (viewportWidth < 700) { $('#wrapper').load('A.html'); }; <body> &l ...

What makes this CSS causing render blocking?

I've been meticulously following the Google PageSpeed guidelines in order to optimize the performance of my website. Upon running an analysis, Google provides me with a score based on their set guidelines. There's one particular guideline that ...

Storing data from a JSON file into a dictionary in Discord.py can be achieved by using the

In short, I am looking to store a dictionary called user_messages in a JSON file with the format {'user': amount_of_messages}. Later on, I want to be able to update the message count for each user by opening the file and saving it back to the JSO ...

Do the incoming ajax data trigger any "if" conditionals?

Very new to coding, so forgive me if this is a simple question... I'm currently developing a web application where clicking a "Search" button triggers an ajax request to fetch data, which is then used to populate a table using the jQuery .DataTable m ...

Problems with the zoom functionality for images on canvas within Angular

Encountering a challenge with zooming in and out of an image displayed on canvas. The goal is to enable users to draw rectangles on the image, which is currently functioning well. However, implementing zoom functionality has presented the following issue: ...

How can you determine the HTML element where a mouse click took place?

Is it possible in JavaScript to identify the HTML element where a mouse click occurs without having an event listener attached to the elements? Essentially, I want to be able to capture the mouse click event and determine the specific element on the page ...

Trouble with executing AJAX for API call

My current project is built on CI3 and I have created an API that belongs to a different domain than the application itself. $.ajax({ url: "http://www.example.com/restapi/index.php/api/user", type: "GET", data: {"user_id": user_id} ...

What is the best way to test a component that displays its children elements?

I am encountering an issue with testing the functionality of a component I have created. The component is a Button that accepts props such as className, children, and otherProps. export default function Button({ className, children, ...otherProps }) { r ...

What is the reason for AngularJS's inclusion of a colon at the end of a data object in an $http post

While attempting to utilize angular js $http for sending a post request to elasticSearch, I encounter an "Unexpected token : " Error. Here is a snippet of my code: var request= $http({ method: "post", url: path, accept:"*/*", headers:{"Co ...

I am facing some difficulties with my deployed CRA website on Github Pages, as it appears to be malfunctioning compared to when I was running it on localhost using VS Code

After deploying my CRA website on Github Pages, I noticed that it is not functioning the same as it did when running on localhost using VS Code. The site retrieves data from SWAPI and performs manipulations in various React components. While everything wor ...

Tips for extracting a JSON array that is stored as a string in BigQuery

I am working with a JSON array that has the following structure: [{"key":"Email","slug":"customer-email","value":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="48292a2b082f25292124662b2725">[email protected]</a>" ...

Identifying the Origin of the Mouse Pointer When Hovering Over Elements

Could someone please advise on how to detect the movement of the mouse pointer using jQuery when it hovers over an element such as a div? I am looking for a way to determine if the mouse pointer entered the element from the top, left, bottom, or right sid ...

Creating these three functions directly in the Parent Component instead of duplicating code in the child component - ReactJS

I am new to React and currently working on a dashboard page that includes a React Table. The page features a customize button that opens a popup with checkboxes to show/hide columns in the table. By default, all checkboxes are checked but unchecking a colu ...

How can the jQuery click() method be utilized?

Currently working on a web scraping project, I have managed to gather some valuable data. However, I am now faced with the challenge of looping through multiple pages. Update: Using nodeJS for this project Knowing that there are 10 pages in total, I atte ...

Exploring the depths of JSON with jq

I need to extract specific values from a nested JSON response. The structure of the JSON response is as follows: { "custom_classes": 2, "images": [ { "classifiers": [ { "classes": [ ...

Error in retrieving Ajax URL with incorrect .net format

Recently delving into C# tutorials to expand my skills, I encountered an issue while attempting to make an ajax call to the server using localhost. Despite my efforts, it seems like I am missing something crucial. It could be related to my folder structur ...

Encountering an "unsupported media type" error while using jquery ajax with json in Spring MVC

I am currently working on a Spring MVC application and I am facing an issue in my JSP where I need to pass an object to the controller and then receive the object back in the JSP. Unfortunately, I am encountering an error message saying "Unsupported media ...

Utilizing fibrous in node.js to efficiently fetch data from the request library

I am struggling to efficiently utilize the fibrous library in conjunction with request for obtaining the body of an HTTP request synchronously. However, I have encountered difficulties in managing the flow. In order to address this issue, I created a simp ...