Incorporate JSON data using jQuery's AJAX in MVC3

Question

Incorporate JSON data using jQuery's AJAX in MVC3

I need assistance with parsing the JSON data retrieved from a webservice through my controller. Currently, I am displaying the entire JSON string in a div as text. However, I only want to extract specific values such as "color" and "size". I am unsure of the terminology and process involved in this task, whether it needs to be done within the controller or JavaScript. Any guidance on object arrays, deserialization, etc., would be greatly appreciated.

$.ajax({
    url: this.href,
    type: 'GET',
    dataType: "json",
    data: { myPartNo: returnVal },
    success: function (result) { 
        ShowJson(result);
    }
});

javascript json asp.net-mvc-3

Answer 1

Answer №1

When working on the backend, it is common to create a DTO (data transfer object) that contains all the necessary information:

public class MyDataObject
{
    public string value {get; set;}
    public string color {get; set;}
    public int size { get; set; }
}

In the controller, you can simply convert this object into JSON format:

ActionResult MyController(int someParameter)
{
    MyDataObject model = new MyDataObject();
    model.value = ...
    return this.Json(model);
}

On the frontend, you can then process the returned JSON data as an ordinary object:

ShowJson(result.color);

//or

$("#mydiv").css("color", result.color); // for example

Answer 2

When working on the backend, it is common to create a DTO (data transfer object) that contains all the necessary information:

public class MyDataObject
{
    public string value {get; set;}
    public string color {get; set;}
    public int size { get; set; }
}

In the controller, you can simply convert this object into JSON format:

ActionResult MyController(int someParameter)
{
    MyDataObject model = new MyDataObject();
    model.value = ...
    return this.Json(model);
}

On the frontend, you can then process the returned JSON data as an ordinary object:

ShowJson(result.color);

//or

$("#mydiv").css("color", result.color); // for example

Incorporate JSON data using jQuery's AJAX in MVC3

Answer №1

Similar questions

Tips for displaying user-entered information from a form after submitting it with PHP

My current issue lies in my ability to successfully retrieve data from the controller using AJAX calls in .NET CORE, however, I am

Tallying the Number of Accordion Toggle Clicks

Submitting JSON through JQuery to a Spring Roo Handler

The React component fails to render on the screen

Reorganize divisions using Bootstrap

Using setInterval on a batch of freshly generated div elements

issues with jquery progress bar not updating value

Understanding how to utilize jQuery or prototype to interpret onclick event containing "setLocation(...)" can enhance the functionality

Is a function repeatedly invoked?

Unexpectedly, optimization causing issues on Angular site without explanation

What is the method for sending an object to a concealed form within php?

Is there a way to monitor and trigger a function in jQuery when a loaded PHP file is modified?

In TypeScript, the function is failing to retrieve the complete array value

I am attempting to link my Firebase real-time database with Cloud Firestore, but I am encountering import errors in the process

Is there a way to display the HTML input date by simply clicking on text or an image?

observing calls made with twilio using javascript

What methods can be used to include optional settings in a custom JsonDotNetResult?

The mouseup event fails to trigger upon dropping a component with React-dnd

Make sure that the iframe loads the next page with enough force to break out