title: FooTable + ASP.NET Gridview
body: <p>I'm trying to get footable working with my asp.net gridview. I have followed every ASP.NET guide on the internet for footable and nothing seems to work. </p>
  
  <p><strong>Gridview ASP Markup</strong></p>
  
  <pre><code>&lt;asp:GridView ID="GridView1" runat="server" CssClass="footable"  AutoGenerateColumns="false" OnRowCommand="GridView1_RowCommand" DataKeyNames="ClientID" DataSourceID="SqlDataSource1" Style="max-width: 1024px" OnSelectedIndexChanged="GridView1_SelectedIndexChanged"&gt;
      &lt;Columns&gt;
          &lt;asp:CommandField ShowSelectButton="True" /&gt;
          &lt;asp:BoundField DataField="ClientID"  HeaderText="Client ID" InsertVisible="False" ReadOnly="True" SortExpression="ClientID" /&gt;
          &lt;asp:BoundField DataField="FirstName" HeaderText="First Name" SortExpression="FirstName" /&gt;
          &lt;asp:BoundField DataField="LastName" HeaderText="Last Name" SortExpression="LastName" /&gt;
          &lt;asp:BoundField DataField="Suburb" HeaderText="Suburb" SortExpression="Suburb" /&gt;
          &lt;asp:BoundField DataField="MobileNumber" HeaderText="Mobile Number" SortExpression="MobileNumber" /&gt;
      &lt;/Columns&gt;
  &lt;/asp:GridView&gt;
  </code></pre>
  
  <p><strong>Code Behind File</strong></p>
  
  <pre><code>GridView1.HeaderRow.TableSection = TableRowSection.TableHeader;
  
  GridView1.HeaderRow.Cells[0].Attributes["data-class"] = "expand";
  GridView1.HeaderRow.Cells[2].Attributes["data-hide"] = "phone, tablet";
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(function () {
      $('[id*=GridView1]').footable();
  });
  </code></pre>
  
  <p>If anyone has any idea that would be amazing.</p>