Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 7113
  • Last Modified:

Gridview using bootstrap and Html5

Hi Experts,

I want a Grid similar to attached screenshot  using Html5 ,bootstrap and angularjs .Basically the Grid contains readonly data and need sorting by column.  

How can I achieve grid using bootstrap and html5 and what bootstrap classes do I need to use ? If possible any sample working code would be highly appreciated.

Thanks in Advance
Gridview.JPG
0
ksd123
Asked:
ksd123
  • 2
  • 2
1 Solution
 
Scott Fell, EE MVEDeveloperCommented:
What you are showing is a table and not a css grid.  Bootstrap  has a css grid made up of 12 columns http://getbootstrap.com/css/#grid.   What may be confusing the matter is some projects like wijmo http://wijmo.com/widgets/wijmo-complete/grid/  call that a grid as does kendo http://demos.telerik.com/kendo-ui/web/grid/index.html.

You will pay $400 to $1000 for those projects.  There is an open source project called datatables http://datatables.net/release-datatables/examples/basic_init/zero_config.html that will do the very same thing.  You can use jquery ui themes to make them look a little nicer https://datatables.net/release-datatables/extras/ColReorder/theme.html

Those are basically well formed tables with javascript for things like ajax and sorting.
0
 
ksd123Author Commented:
Thank you. We are migrating ASP.net  web application to HTML5.In the Asp.net web app we

are using telerik controls .For html app ,so far we are not any using third party controls .

Can you suggest me best way to implement Gridview similar to screenshot in HTMLS App?
0
 
Scott Fell, EE MVEDeveloperCommented:
>Can you suggest me best way to implement Gridview similar to screenshot

I thought that is what this answer was http:#a39849557
0
 
ksd123Author Commented:
Thank you
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now