title: ASP.NET 4 GridView doesn't show arrows when sorting and binded with generic List<T>
body: <p>My question is: How to make GridView show arrows when sorting and binded with generic List?</p>
  
  <p>I've being testing the new properties in ASP.NET to show arrows when sorting in a GridView following this blog entry <a href="http://blogs.msdn.com/b/scothu/archive/2010/08/28/gridview-with-sort-arrows-and-showing-header-when-empty.aspx" rel="nofollow">http://blogs.msdn.com/b/scothu/archive/2010/08/28/gridview-with-sort-arrows-and-showing-header-when-empty.aspx</a>.</p>
  
  <p>My aspx markup is like so</p>
  
  <pre><code>&lt;asp:GridView ID="GridView2" runat="server" AllowSorting="true" CssClass="gridView"
  ...
      &lt;SortedAscendingCellStyle BackColor="#F5F7FB" /&gt;
      &lt;SortedAscendingHeaderStyle BackColor="#6D95E1" CssClass="SortedAscending" /&gt;
      &lt;SortedDescendingCellStyle BackColor="#E9EBEF" /&gt;
      &lt;SortedDescendingHeaderStyle BackColor="#4870BE" CssClass="SortedDescending" /&gt;
  ...
  &lt;/asp:GridView&gt;
  </code></pre>
  
  <p>It works fine for me when GridView is binded with a SqlDataSource or DataSet and I've seen in articles that ObjectDataSource works well too. It generates something like the following HTML markup.</p>
  
  <pre><code> &amp;lt;th style="background-color: rgb(109, 149, 225);" scope="col" class="SortedAscending"&amp;gt;&amp;lt;a style="color: White;" href="javascript:__doPostBack('ctl00$MainContent$GridView3','Sort$Name')"&amp;gt;Name&amp;lt;/a&amp;gt;&amp;lt;/th&amp;gt;
  </code></pre>
  
  <p>The important thing I see here is <code>class="SortedAscending"</code>. That's the name I gave to the <code>SortedAscendingHeaderStyle</code> attribute of the aspx page.</p>
  
  <p>My problem is that my BLLs return <code>generic List&lt;T&gt;</code> and when I bind those to GridView, it generates something like the following HTML markup.</p>
  
  <pre><code>&amp;lt;th scope="col"&amp;gt;&amp;lt;a style="color: White;" href="javascript:__doPostBack('ctl00$MainContent$GridView2','Sort$Name')"&amp;gt;Name&amp;lt;/a&amp;gt;&amp;lt;/th&amp;gt;
  </code></pre>
  
  <p>In this markup, I'm missing <code>class="SortedAscending"</code> and that's why I'm having trouble getting arrows in my GridView.</p>