Category Archives: Footable

How to use jQuery and Footable to make GridView responsive

Nowadays make a website compatible with desktop platforms and mobile is a must.
Making a responsive design is important to adapt the content of your website to the platform where it will be viewed.
To render the GridView control responsive we procdeed to hide some columns with Footable and jQuery plugins.
In order to do that, download Footable plugin
Now in your aspx page add the follow code:

Add a GridView control, this is the ASP.NET code for that:

Initialize footable plugin to the GridView control

Populate the GridView with data

The default header row for GridView is now generated, now we need to make it accessible

So we can proceed to define which colums will be hided in which devices

You can teel to Footable which columns to hide on which breakpoints, by specifying data-hide attributes on the table head columns