Version 7 (modified by Dominic König, 11 years ago) ( diff )


BluePrint: Data List


In many cases, the representation of data in a table visually dissolves the structure of the information, and is therefore difficult to consume for user:

Data Table (Sahana Eden)

An alternative concept is to represent records as a list of cards with a context-adapted per-item design (typically nested DIVs which allow various styling options):

The most commonly known example for this concept is certainly the facebook-timeline, but many other websites have adopted this concept as well:

Data List (Youtube)

Currently, Sahana-Eden lacks a framework for these data lists - whereas there is a fairly complete framework for data tables. This BluePrint is for a datatables-equivalent framework for data lists.


  • tbw


  • active tasks for a project (or a user)
  • timeline of incident reports
  • CAP alerts
  • list of requests
  • list of projects


  • tbw


  • Basic HTML renderer
  • Basic CSS

Basic Implementation

  • Ajax pagination
    • Infinite scroll
  • Integration into S3CRUD
    • Option of regular select() method or separate method?
    • Integrated page with FilterForm and AddForm


  • Configuration hooks
    • Custom Item Renderer
    • Item Actions
  • Customizable Item Renderer
  • Item Actions
    • read/edit/delete/...custom
    • action buttons/links/icons
    • authorize actions per item
  • Export options
    • Formats-row like in datatables

Later (not on roadmap yet)

  • Ajax Filtering
  • Ajax Sorting
  • Inline-Editing
    • Ajax-add items
    • Ajax-edit items
    • Ajax-remove items
  • Bulk actions:
    • Multi-Select
  • Embedding of components
    • similar to S3InlineForms
    • collapsable/expandable
  • Mixed Resources (using common filters/forms)
  • Drag&Drop
    • to build user-customizable lists (subscription)
  • feel free to add more...


  • tbw


  • Renderer: S3DataList in
  • CRUD integration: currently as /list_div method


  • ...


Attachments (2)

Download all attachments as: .zip

Note: See TracWiki for help on using the wiki.