question 1:

i implemented your responsive gridview as you explained and everything works. the problem is i require the grid to be able to do more. i added in my own styling and paging and sorting ( html and behind code.

il add the code below for you to see through it. )

so on page load everything works perfectlty togther, but when i page to the next page suddely all the responsive code dispears and im left with my styling and sorting and paging. what happened that it didnt stay? how do i get it to stay?

question 2:

the expand icon was added to each row as expected, the problem is, it was also added to the paging buttons. how do i write the code so that if paging button is present, the icon would be removed from the last row?

thanks so much for all your help in advance

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!this.IsPostBack)
            {
                grid();
            }
        }
        public void grid() {
            DataTable dt = new DataTable();
            dt.Columns.AddRange(new DataColumn[4] { new DataColumn("Id"), new DataColumn("Name"), new DataColumn("Country"), new DataColumn("Salary") });
            dt.Rows.Add(1, "John Hammond", "United States", 70000);
            dt.Rows.Add(2, "Mudassar Khan", "India", 40000);
            dt.Rows.Add(3, "Suzanne Mathews", "France", 30000);
            dt.Rows.Add(4, "Robert Schidner", "Russia", 50000);
            GridView1.DataSource = dt;
            GridView1.DataBind();

            //Attribute to show the Plus Minus Button.
            GridView1.HeaderRow.Cells[0].Attributes["data-class"] = "expand";

            //Attribute to hide column in Phone.
            GridView1.HeaderRow.Cells[2].Attributes["data-hide"] = "phone";
            GridView1.HeaderRow.Cells[3].Attributes["data-hide"] = "phone";

            //Adds THEAD and TBODY to GridView.
            GridView1.HeaderRow.TableSection = TableRowSection.TableHeader;
        }

        #region gridPagingAndSorting
        protected void gridView_PageIndexChanging(object sender, GridViewPageEventArgs e)
        {
            grid();
            GridView1.PageIndex = e.NewPageIndex;
            GridView1.DataBind();
        }
        private string ConvertSortDirectionToSql(SortDirection sortDirection)
        {
            string newSortDirection = String.Empty;

            switch (sortDirection)
            {
                case SortDirection.Ascending:
                    newSortDirection = "ASC";
                    break;

                case SortDirection.Descending:
                    newSortDirection = "DESC";
                    break;
            }

            return newSortDirection;
        }
        protected void gridView_Sorting(object sender, GridViewSortEventArgs e)
        {
            DataTable dataTable = GridView1.DataSource as DataTable;

            if (dataTable != null)
            {
                DataView dataView = new DataView(dataTable);
                dataView.Sort = e.SortExpression + " " + ConvertSortDirectionToSql(e.SortDirection);

                GridView1.DataSource = dataView;
                GridView1.DataBind();
            }
        }
        #endregion

<asp:GridView 
    ID="GridView1" 
    CssClass="footable table table-striped table-bordered table-hover" 
    runat="server" 
    AutoGenerateColumns="false"
    Style="max-width: 100%"
    RowStyle-Wrap="true"
    OnPageIndexChanging="gridView_PageIndexChanging"
    OnSorting="gridView_Sorting"
    PageSize="2"   
    AllowPaging="true">
    <Columns>
        <asp:BoundField DataField="Name" HeaderText="Customer Name" />
        <asp:BoundField DataField="Id" HeaderText="Customer Id" />
        <asp:BoundField DataField="Country" HeaderText="Country" />
        <asp:BoundField DataField="Salary" HeaderText="Salary" />
    </Columns>
</asp:GridView>