Grid Layout in MVC

Sri Ram

9y2.2k.NET

I have a requirement to display data in a grid format in MVC web application. The grid or table showing the data should have below listed features:

Grid or Html table with sorting and custom paging logic
Data in tabular format should be displayed using Bootsrap css so that in a mobile view, data from each column should be wrapped down instead of having a horizontal scroll bar to see all column details
Ability to enable/disable sorting for required columns
Nice styling for paging links
Able to provide an option for page size (like 10, 50, 100, 200 in a drop-down)
No third-party components are allowed
No client-side plugins allowed ( like jquery DataTable )

The environment restricts the usage of client-side libraries so majority of the work should be done on server-side. This has to be achieved using a minimal javascript code if required.

Can anyone help on this with an example?

Your support is highly appreciated.

7 Replies

Know the answer? Post it — somebody with the same question will find it here.

Sri Ram9y ago
Thanks a lot everyone for all of your responses.
As of now, we use bootstrap css and jquery library to bring-in the responsive design for all screens as much as possible.

Client doesn't like to use much of client-side libraries or don't want to depend on them since the users might be using older versions of browsers and also its a restricted environment.
Client will approve any components from Microsoft or custom logic with full server-side support.

This requirement is for building an enterprise level application so much of the work should be done on server-side as per client. Hence, we can't use external packages like pagedlist.mvc, grid.mvc, angular/knockout libraries etc.

In this regard, it looks like this could be possible using the custom logic and bootstrap css. If anyone has a good reference or solution considering all these things, please let me know.

It would be very much helpful for our team.
Thiruppathi R9y ago
Refer the below URLs

https://github.com/prmces/Grid.Mvc.Redux.IdeaMatrix

http://gridmvc.codeplex.com/

https://github.com/prmces/Grid.Mvc.Ajax.IdeaMatrix

http://grid.tesseris.com/
Thiruppathi R9y ago
Without client side libraries we can't achive the responable UI.But anyway my suggestion better you can try angular table or angular UI Grid...
Sri Ram9y ago
Hi Manikandan, thanks for your response. The link you have referenced points to Grid.MVC external package which can't be considered in our scenario. Anything from Microsoft or custom code would be approved to include in the solution.
Sri Ram9y ago
Hi Sundar, thanks for your response. The link you have referenced points to pagedList.MVC external package which can't be considered in our scenario.
Manikandan Murugesan9y ago
Refer this article : http://www.c-sharpcorner.com/UploadFile/4d9083/creating-simple-grid-in-mvc-using-grid-mvc/
Sundaram Subramanian9y ago
Follow this link, this will help you, thanks in advance

http://www.c-sharpcorner.com/UploadFile/4b0136/perform-paging-searching-sorting-in-Asp-Net-mvc-5/