Unreadable characters displaying in ASP.NET MVC

Question

I am trying to build a store front.

StoreViewModel
public class StoreViewModel

{
    public IEnumerable<GetStoreFrontItems_Result> StoreFrontItems { get; set; }
}

Index.aspx

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<StoreViewModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    ..:: Gods Creation Taxidermy :: Store ::..
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <div class="maintext">
        <h2 class="sectionHeader2">:: Gods Creation Taxidermy : Store Items ::</h2>
        <br />
       At times I end up with items and mounts that the owner never came to pick up, so I put them up for sale to help generate 
       some revenue for Gods Creation Taxidermy. 

       <strong>NOTE:</strong> Now before you freak out and think I'm going to sell your mount remember the items for sale are several years old
       and the owner simply didnt make the final payment or for some reason left it here.

        <% Html.DataList(Model.StoreFrontItems).Columns(7).Item(item =>
        {
            item.Template(storeItems =>
            {%>
                <div style="margin-right:45px; line-height:150%;">
                    <span><%: Html.ActionLink(storeItems.CategoryName, "List", new { @animal = storeItems.CategoryName });%></span>                    
                </div>  
         <%--       <div style="margin-right:45px; line-height:150%;">
                    <span><% = galleryImage.ItemName%></span>
                </div>
                <div style="margin-right:45px; line-height:150%;">
                    <span><% = galleryImage.ItemPrice%></span>
                </div>--%>
                    <%});
        }).Render(); %>

    </div>
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="MetaTagsContent" runat="server">
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="LeftColumnContent" runat="server">
</asp:Content>

GetStoreFrontItems_Result is generated with function import. Here is the code from Index in StoreController:

[CanonicalUrlAttribute("Store")]
[CompressionFilter(Order = 1)]
[CacheFilter(CacheDuration = 120, Order = 2)]
public virtual ActionResult Index()
{
    GodsCreationTaxidermyEntities context = new GodsCreationTaxidermyEntities();
    var viewModel = new StoreIndexViewModel() { StoreFrontItems = context.GetStoreFrontItems() };
    return View(viewModel);

Here are some screenshots, one showing the error and the other showing what gets displayed.

Answer 1

As far as the error is concerned from what you have shown as code it is impossible to answer why does it happen (although the error message seems more than pretty self explanatory). As far as the garbage characters are concerned they are caused by the Compression filter you are using on your action. Here's a blog post which explains perfectly fine the reason and how to fix it.

The proposed solution is to put the following in your Global.asax to cancel the effect of ASP.NET stripping the custom compression HTTP headers that your CompressionFilter might have added in case of an exception:

protected void Application_PreSendRequestHeaders()
{
    // ensure that if GZip/Deflate Encoding is applied that headers are set
    // also works when error occurs if filters are still active
    HttpResponse response = HttpContext.Current.Response;
    if (response.Filter is GZipStream && response.Headers["Content-encoding"] != "gzip")
        response.AppendHeader("Content-encoding", "gzip");
    else if (response.Filter is DeflateStream && response.Headers["Content-encoding"] != "deflate")
        response.AppendHeader("Content-encoding", "deflate");
}