3 Replies - 450 Views - Last Post: 01 August 2014 - 07:41 AM

#1 addisonian  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 01-August 14

Website Table that can be Sorted, Filtered and Edited

Posted 01 August 2014 - 06:44 AM

I'd like to create a table on an internal website at my company. I'd like to hear from experienced web programmers what some options are for doing this.

The result I'm looking for is a table of files. The table would provide a list of file names, descriptions of each file, a link to each file, and any other pertinent info, like when each file was last updated.

Since there will be many files in this table, it needs to be able to be filtered by topic/category. Each file needs to be able to have multiple topics/categories associated with it. It would also help if the table can be sorted and edited.

Please see the attached image for an example (I am a bridge engineer, so all the files pertain to different aspects of bridge design).

I am somewhat familiar with HTML, CSS, Javascript, jQuery, Python, Ruby and PHP.

With the knowledge I currently have, the best way I can think of setting up the table is this:
  • Create an HTML table with all the files listed in the table.
  • Each table row would have classes associated with it. The classes would represent the topics/categories that the file belongs to.
  • Put a bunch of topic/category checkboxes at the top of the table, with a couple buttons like "Filter" and "Show All".
  • If the user would like to find all the files related to "Concrete", they would check off the "Concrete" checkbox, then hit the "Filter" button.
  • Then I would use jQuery to hide all the table rows that do not have the classes that match the ones that the user checked off.


Here are the limitations of this method that I would like to overcome:
  • All the list items are hard-coded into HTML. I'd prefer to have the items in some sort of array or database, or just some way that I can manage them easier.
  • I'd like an easy way to add, edit and remove items, other than going directly into the HTML and editing it.
  • I'd like the table to be separated from the actual main page that it will reside on because I'd like to be able to pull the table into other pages of our website that are devoted to a particular topic, and automatically filter the table based on that topic.


Any and all ideas on how to set something like this up would be greatly appreciated!!!

Thanks!!!

Attached Image

Is This A Good Question/Topic? 0
  • +

Replies To: Website Table that can be Sorted, Filtered and Edited

#2 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3541
  • View blog
  • Posts: 10,250
  • Joined: 08-June 10

Re: Website Table that can be Sorted, Filtered and Edited

Posted 01 August 2014 - 07:06 AM

Id go for the easy option. someone already has done this (e.g. dataTables, but thats just one off the top of my head)
Was This Post Helpful? 0
  • +
  • -

#3 addisonian  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 01-August 14

Re: Website Table that can be Sorted, Filtered and Edited

Posted 01 August 2014 - 07:20 AM

"datatables" looks interesting, although it looks like it does not allow you to filter items. Filtering the list based on multiple topics/categories is the biggest need I have.

This post has been edited by Dormilich: 01 August 2014 - 07:42 AM
Reason for edit:: removed previous quote

Was This Post Helpful? 0
  • +
  • -

#4 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3541
  • View blog
  • Posts: 10,250
  • Joined: 08-June 10

Re: Website Table that can be Sorted, Filtered and Edited

Posted 01 August 2014 - 07:41 AM

it has a search box (by default, but configurable)
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1