KISS Tabular View

KISS- Keep it Simple Stupid

This post is about a simple html tabular view using bootstrap and a kind of raw grid with sort & search option using ASP.MVC framework.

I always like to keep a lot of things (not everything) simple, not that i don't like owning NOT so simple things ;) 
From development perspective the KISS principle has been spreading lately. Simplicity, the first thing that pops up when i hear that word, it would be Google. Well in fact "simple" is more like "beauty" it's in the eye of the beholder. Here is a sample whose idea on simple contradict with that of mine. May be we can't jump into conclusion that if something is simple to someone it is the same for the other.
So on that same idea of Simple i will try to make a simple page with a simple grid with simple lines of code.

Here is simple table which has got nothing to do with this post.




Let us Create trivial class Employee like this

Now lets create a PersonController and return a dummy list of person


Before you do that, Nuget Bootstrap by Twitter & Nuget PagedList by TroyGoode. New to Nuget then try this

The View page source is as below

There is nothing new happening in the View, Its just a simple HTTP GET/POST. The first div the search part, second is the paging and the th tag is where the sort query string is passed.

To make things reusable i have made some extensions to IEnumerable in the Util class.


In this extension methods we made use of Generic type and Reflection so that it is really "Re-Usable".

You can check out the complete source of this sample page on GitHub
You can even see the live working link on AppHarbor

Here is a snapshot of the KISS view that we have in hand



Isn't that "Simple" now? ;-) 



Comments

Popular posts from this blog

Launch .Net Core with VSCode for starters

Protecting sensitive data using Secret Manager in .Net Core

Load Testing an nodejs API