Any way I can use DataTables to do this?
Any way I can use DataTables to do this?
Greetings All !
Over the past month, I've fallen in love with Datatables and have incorporated it into two small web apps so far. I've added in the nice column visibility, column sorting, pagination, and export features to both of those apps. I'm very thankful that I found this site!
But now I've got a small web app (one that's been previously built a la .NET MVC with Razor)... where... I'm starting to see a need to add column sorting and better export features.
But when I look at how one of the main tables is designed, I'm scratching my head as to how to get this same sort of table layout with Datatables, because it is a bit unusual.:
The data is rather simple; it's mostly names. Only recently have we started adding in "shift name" (and there is a request for us to put in some sort of "expert" flag" as well). Also, there are icons next to each name that act as hyperlinks, linking to the "edit" and "delete" method posts.
(I've attached a screenshot example.)
What the current code does is... look at the number of items, divide it by a "max columns" value (so as to determine how many rows we should have in each column)... and then starts looping through the data, drawing the first column, then the second, etc.
Each column basically contains its own little HTML table. (But of course, it doesn't HAVE to; this is just the design solution that was originally chosen. The most names we have had to display, historically, has only been about 30.)
Now, of course, as the data grows, I would add pagination a la DataTables. But I'd still like to keep this top-to-bottom, left-to-right kind of layout, since the amount of actual text / data in each "cell" is not very big.
Any thoughts?
Thanks!
-= Dave =-
This question has an accepted answers - jump to answer
Answers
Hi Dave,
Good to hear that DataTables has been going well for you so far! Unfortunately the kind of layout shown in your screenshot just isn't possible in DataTables. There might be some CSS hack possible where by table cells are
display: block
and floated, rather than actually just being table cells, but fundamentally DataTables is table layout based (i.e. rows) rather than being a grid layout.Allan