Passing C# Data structure to javascript

Question

Here is my javascript and below is my C# code:

    //javascript in view
    var data = {
        labels: [@Misc.printData(Model.chartLabels, true)],
        datasets: [
            {
                fillColor: "rgba(151,187,205,0.5)",
                strokeColor: "rgba(151,187,205,1)",
                data: [@Misc.printData(Model.chartData, false)]
            }
        ]
    }

    //C# helper
    public static IHtmlString printData(IEnumerable<string> data, bool putQuotes)
    {
        string str = String.Empty;

        if (!data.Any())
            return new HtmlString(str);

        if (putQuotes)
            str = @"""" + data.Aggregate((result, next) => result + @""", """ + next) + @"""";
        else
            str = data.Aggregate((result, next) => result + ", " + next);

        return new HtmlString(str);
    }

I am trying to populate a data structure in javascript with the information in a C# model passed to me by the controller. This is obviously an awful hack. Is there a better way to do it?

U can use ViewBag set it works more like sesion variable but with that you can comunicate if you dont work with MVC — Radu
– Radu, Commented Mar 21, 2014 at 18:09

Timothy Shields · Accepted Answer · 2014-03-21 18:11:26Z

1

Using JSON.NET (available via NuGet), you can do this in your Razor view:

@Html.Raw(Newtonsoft.Json.Linq.JToken.FromObject(Model).ToString()))

That will write out a JSON representation of your Model object. This can of course be encapsulated in a helper function so it's not so hard to read.

To match your example, you would do this:

var data = {
    labels: @Html.Raw(Newtonsoft.Json.Linq.JToken.FromObject(Model.chartLabels).ToString())),
    datasets: [
        {
            fillColor: "rgba(151,187,205,0.5)",
            strokeColor: "rgba(151,187,205,1)",
            data: @Html.Raw(Newtonsoft.Json.Linq.JToken.FromObject(Model.chartData).ToString()))
        }
    ]
}

answered Mar 21, 2014 at 18:11

Timothy Shields

80.3k21 gold badges127 silver badges173 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

sirdank Over a year ago

Excellent, thank you! I've never used JSON before but you made it very easy.

Timothy Shields Over a year ago

@sirdank JSON stands for JavaScript Object Notation, so if you've used JS, you've sort of already been using JSON without knowing it.

Eric Scherrer · Accepted Answer · 2014-03-21 18:11:17Z

1

There is a really good library called Json.Net you can use to serialize a .Net objects into Json:

Json.Net

answered Mar 21, 2014 at 18:11

Eric Scherrer

3,4091 gold badge21 silver badges35 bronze badges

Comments

RKS · Accepted Answer · 2014-03-21 18:11:37Z

0

Pass it as JSON. That's the best way to do it.

answered Mar 21, 2014 at 18:11

RKS

1,43012 silver badges21 bronze badges

Collectives™ on Stack Overflow

Passing C# Data structure to javascript

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related