Iterate on a JSON in JavaScript Asp.net

Question

I have following data that I have serialized as JSON from my code behind file.

public class PieModel {
    public string label { get; set; }
    public double data { get; set; }
}

var data = new List<PieModel> {
    new PieModel { label = "Pending", data = 10d }
    new PieModel { label = "New", data = 40d }
    new PieModel { label = "Overdue", data = 50d }
};

hdnData.Value = new JavaScriptSerializer().Serialize(data);

I read this serialized data in JavaScript like this

var tempHdnData = $("#hdnData");

But now I want to iterate on tempHdnData and get label and data members separately in JavaScript code. How can I achieve that?

Answer 1

You could write your code like this in the code behind:

protected List<PieModel> GetData() {
    return new List<PieModel> {
        new PieModel { label = "Pending", data = 10d }
        new PieModel { label = "New", data = 40d }
        new PieModel { label = "Overdue", data = 50d }
    };
}

And in your webform:

var tempHdnData = <%= new JavaScriptSerializer().Serialize(GetData()) %>

Now you can write

$.each(tempHdnData, function (_, data) {
    console.log(data)
})