CSV Table Block Concept for Episerver

This is an option to avoid using tables in WYSIWYG HTML editor. Tables in any rich text editor have always been problematic for responsive design, but data often exists in table format (for example in Excel) so the usage of table tools is inevitable.

We are using CSV (comma separated values) as a description of the table because almost all systems and software (for example Excel) can produce CSV data. Also because CSV is readable and editable for a much larger group of people than for example XML or JSON. PropertyList would be one good option to improve the editor's experience but in this case, the data came mostly from external sources. So the import feature was much more important.

CSV Table Block Example

(unfortunately, screenshots and URL examples are only in Finnish) You can find the live example of table block in Evira's web page.

 

CSV format is customized to support links and simple formatting.  

Implementation

Front-end is mostly made with jQuery plugin DataTables. It's simple and easily customized for various needs. UI and responsive design come from Bootstrap table styles. And the backend is simple Episerver block implementation with CSV to Table conversions. Unfortunately, the codes are not (yet) publicly available.  

This is an option to avoid using tables in WYSIWYG HTML editor. Tables in any rich text editor have…