In this article, I am going to explain how to bind ASP.NET MVC views with anonymous type collection objects.
Introduction
In general for every view in ASP.NET MVC, there is a dedicated Model that is specified as @model in the views file that is used to bind data to the Views. If not, we sometimes create a ViewModel that is basically properties of one or more model as per the need of the data that a view has to display.
In a scenario, where we are returning LINQ anonymous type object collection to the Views by joining more than one object collection, its impossible to bind to the views unless you have some workaround.
Objective
After spending couple of hours googling for the solution of binding anonymous type to the views and finally came up with this solution. The objective of this article is to demonstrate how to bind anonymous type collection to the ASP.NET MVC views in a pretty simple and straight forward way.
Some error you may get while binding Anonymous type to the Views
In general you may come across below errors when you are trying to bind anonymous type objects to the view (depending on which approach you are following)
- The model item passed into the dictionary is of type 'System.Collections.Generic.List`1[<>f__AnonymousType7`9[System.Int32,System.String, System.Int32,System.Int32,System.DateTime,System.String,System.String,System.String,System.String]]', but this dictionary requires a model item of type 'System.Collections.Generic.IEnumerable`1[xxxModel]'.
- The model item passed into the dictionary is of type 'System.Collections.Generic.List`1[<>f__AnonymousType7`9[System.Int32,System.String, System.Int32,System.Int32,System.DateTime,System.String,System.String,System.String,System.String]]', but this dictionary requires a model item of type 'System.Collections.Generic.List`1[System.Object]'.
- System.NotSupportedException: LINQ to Entities does not recognize the method 'System.Dynamic.ExpandoObject ToExpando(System.Object)' method, and this method cannot be translated into a store expression.
Lets see how to bind Anonymous type collections to the ASP.NET MVC Views
In my case my modified ASP.NET MVC view is below, notice lines that are in bold.
@model IEnumerable<dynamic>
<div class="leftPanel">
<div class="spacerBody">
<div class="table">
@foreach (dynamic item in Model)
{
<div class="tr">
<div class="td">
<span class="listTitle"><a href="@Url.RouteUrl("Default", new { controller = "Chart", action = "DesignChart", id = item.AutoId, title = item.NameOfTheChart">@item.NameOfTheChart</a></span><br />
<div class="desc">@Html.Raw(item.CategoryName) </div>
</div>
</div>
}
</div>
</div>
</div>Code Snippet - 1 (View)
Notice the first line of code, its @model IEnumerable<dynamic> (dynamic, not a model class), this is very important as we are going to bind the anonymous type object.
Again notice the @foreach, here also we are using dynamic keyword instead of var.
Now, lets see the Controller method
public ActionResult Index()
{
dynamic charts = (from ch in db.ChartModels
join
ca in db.CategoryModels
on ch.CategoryId equals ca.CategoryId
where ch.Active == true && ch.IsPublished == true && ch.IsPublic == true
select new
{
ch.AutoId,
ch.NameOfTheChart,
ca.CategoryName
}).AsEnumerable().Select(c => c.ToExpando());
return View(charts);
}
Important: Make sure that you are using the namespace of the ToExpando() method (declared in the last code snippet of this article) in this controller otherwise c.ToExpando() method will not appear.
Notice that the return result of the LINQ query is also dynamic.
In the above method, we are returning fields from two Model collections by joining both on CategoryId.
ToExpando() method
Also notice the ToExpando() extension method at the last of the LINQ query. ToExpando is an extension method defined by me in a new static class file in my project. You can define this extension method in any static class file into your Project.
The namespace to be used into this static class is following.
using System.Dynamic;
using System.Web.Mvc;
using System.Collections.Generic;
public static class impFunctions
{
public static ExpandoObject ToExpando(this object anonymousObject)
{
IDictionary<string, object> anonymousDictionary = HtmlHelper.AnonymousObjectToHtmlAttributes(anonymousObject);
IDictionary<string, object> expando = new ExpandoObject();
foreach (var item in anonymousDictionary)
expando.Add(item);
return (ExpandoObject)expando;
}
}What is ExpandoObject?
ExpandoObject is an object whose members can be dynamically added and removed at run time. This ExpandoObject is very helpful in our case when we have to return the anonymous type collection to the view as we are going to add our anonymous type objects as the collection of ExpandoObjects. ExpandoObject is very flexible and dynamic in nature. To know more about it
read here.
The above extension method "ToExpando" is self explanatory however to sum up its basically creating a Dictionary of objects based on the objects being passed to this method and then adding those objects into a dictionary of ExpandoObject type and returning it.
Once you have returned the ToExpando() from the Controller method, you are done as everything is already setup in the our Views (see above).
The Code Snippet - 1 (View) is looping through the Model (in this case ExpandoObject that is basically a collection of Anonymous type objects) and accessing its properties to list the data.
Conclusion
Returning anonymous type object collection to the views and binding them is not straight forward in ASP.NET MVC, so the ExpandoObject comes to the rescue and helps us to bind as if we are returning ViewModel object.
Hope this solution will be helpful for people looking for the solution. Should you have any question or facing any problem while working on this, let me know by responding to this article.
Do share this article to your friends and colleague to help them.