Pass array from MVC to javascript?

Question

I can pass a variable from ASP.NET MVC using this:

var lastCategoryId = '<%=Model.CS.LastSelectedCategory %>'; 

This works fine with a string or integer, but how do I do this with an array of strings? I tried passing the array in the same way, but the variable is set to System.String []?

Answer 1

It should do

 var someArray=[<%foreach (var s in myStringArray){%>'<%=s%>',<%}%>]; 

Answer 2

You can let .NET handle all the heavy lifting for you with this simple line of code.

It is assumed that you use the Razor MVC syntax.

var yourJavaScriptArray = @Html.Raw(Json.Encode(Model.YourDotNetArray));

For newer versions of MVC use:

var yourJavaScriptArray = @Html.Raw(Json.Serialize(Model.YourDotNetArray));

Answer 3

You can JSON serialize it. This method could go through even more complex values ​​and not worry about excluding simple quotes, double quotes, etc.:

 var categoriesList = <%= new JavaScriptSerializer().Serialize(new[] { "value1", "value2" }) %>; 

Writing an HTML helper for this would be even better:

 public static class HtmlExtensions { public static string JsonSerialize(this HtmlHelper htmlHelper, object value) { return new JavaScriptSerializer().Serialize(value); } } 

and then, in your opinion:

 <script type="text/javascript"> var categoriesList = <%= Html.JsonSerialize(new[] { "value1", "value2" }) %>; </script> 

Answer 4

something like that:

 <script type="text/javascript"> var myArr = [<%=string.Join(",", strArr.Select(o => "\"" + o + "\"")) %>]; </script> 

Answer 5

You need to format the array in JavaScript array syntax.

 var someArray = [<%= Model.SomeArray.Select(x => "'" + x +"'") .Aggregate((x,y) => x + ", " + y); %>]; 

This will cover each entry with single quotes, and then join them along with commas between the square brackets.

Updated: removed additional brackets.

Answer 6

One liner:

 var data = [@Html.Raw(String.Join(",", Model.MyArray.Select(i => "'" + i + "'")))]; 

Answer 7

So simple so simple

 <script type="text/javascript"> var array = @Html.Raw( Json.Encode( (Model).Select(m=> new { id= m.ID, name=m.Name }) ) ); </script> 

Exit:

 [{"id":1,"name":"Name of 1"}, {"id":2,"name":"Name of 2"}, ...]; 

Answer 8

Using Json.NET

 var yourlist = JSON.parse('@Html.Raw(JsonConvert.SerializeObject(Model.YourList))'); 

Answer 9

Just wanted to provide an answer using Razor syntax:

We have a Dictionary<int, int> , which we present for jQuery Sparkline as an "array of arrays".

 var usageData = [ @string.Join(",", Model.UsageData.Select(d => string.Format("[{0},{1}]", d.Key, d.Value)).ToArray()) ]; 

Used like this:

 $('#sparkline').UsageSparkline(usageData, { tooltipFormatter: cachedTooltips }); 

This is what we get when viewing the source:

 var usageData = [ [-13,0],[-12,1],[-11,0],[-10,0],[-9,1],[-8,1],[-7,0],[-6,2],[-5,2],[-4,0],[-3,0],[-2,9],[-1,3],[0,4] ]; $('#sparkline').UsageSparkline(usageData, { tooltipFormatter: cachedTooltips });