Footable style not working on postback

Question

I have a gridview and a row command event for the gridView. I applied footable class to the gridview. Problem is that when I click on View Results button in the GridView, the rowcommand event fires and then footable style no longer applies i.e. it becomes an ordinary gridview on page postback. How to fix this?

     $(function() {
         debugger;
         $('[id*=grdMain]').footable();
     });    

<asp:GridView ID="grdMain" runat="server" AllowPaging="false" PageSize="3" AutoGenerateColumns="false" OnRowCreated="grdMain_onRowCreated"
                    CssClass="footable" Width="100%" EmptyDataText="No Records" OnRowCommand="GridView1_rowcommand"  >
                    <Columns>
                      <asp:BoundField DataField="ChargeItem" HeaderText="ORDER NAME" ReadOnly="true" HeaderStyle-Width="25%"
                            ItemStyle-Width="25%" />
                        <asp:BoundField DataField="DateOfVisit" HeaderText="DATE OF SERVICE" ReadOnly="true"
                            HeaderStyle-Width="20%" ItemStyle-Width="20%" />
                        <asp:BoundField DataField="DoctorName" HeaderText="DOCTOR" ReadOnly="true" HeaderStyle-Width="20%"
                            ItemStyle-Width="20%" />
                        <asp:BoundField DataField="EncounterOrderId" HeaderText="EncounterOrderId" ReadOnly="true"
                            HeaderStyle-Width="25%" ItemStyle-Width="25%" Visible="false" />
                        <asp:TemplateField>
                            <HeaderTemplate>
                                Actions
                            </HeaderTemplate>
                            <ItemTemplate>
                                <asp:Button CssClass="btn btn-info" ID="btnresults" runat="server" Text="Results"
                                    CommandName="RESULT" CommandArgument='<%#Eval("EncounterOrderId")%>' /></ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                    <EmptyDataRowStyle ForeColor="Blue" />
                    <EmptyDataTemplate>
                        <asp:Label runat="server" ID="lblEmptyRecord" Text="No Encounters available"></asp:Label></EmptyDataTemplate>
                    <PagerStyle HorizontalAlign="Center" />
                    <PagerSettings Mode="NumericFirstLast" PageButtonCount="4" FirstPageText="First"
                        LastPageText="Last" />
                </asp:GridView>




protected void GridView1_rowcommand(object sender, GridViewCommandEventArgs e)
    {
        try
        {
            if (e.CommandName.Equals("RESULT"))
            {
                if (e.CommandArgument != "")
                {
                    string[] commandArgs = e.CommandArgument.ToString().Split(new char[] { ',' });
                    int EncounterOrderId = Convert.ToInt32(commandArgs[0]);
                    hdn_EncounterOrderId.Value = Convert.ToString(EncounterOrderId);

                    Button btnConfirm = (Button)e.CommandSource;
                    GridViewRow gvRow = (GridViewRow)btnConfirm.NamingContainer;
                    //Page.ClientScript.RegisterStartupScript(this.GetType(), "ModalScript", "<script type=\"text/JavaScript\" language=\"javascript\">ModalScript(" + EncounterOrderId + ");</script>");
                }
            }

        }
        catch (Exception ex)
        {
            Elmah.ErrorSignal.FromCurrentContext().Raise(ex);
        }
    }

Answer 1

I found the answer. Calling ApplyResponsive in RowCommandEvent fixed the issue. http://www.aspforums.net/Threads/173937/Footable-plugin-not-working-after-page-PostBack-in-ASPNet/

private void ApplyResponsive()
{
    if (GridView1.Rows.Count > 0)
    {
        GridView1.HeaderRow.TableSection = TableRowSection.TableHeader;
    }
}