komarovalexander / ka-table

Lightweight MIT React Table component with Sorting, Filtering, Grouping, Virtualization, Editing and many more

Home Page:http://ka-table.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

rowSpan and colSpan for the cells

ZenWhite opened this issue · comments

Hi. I need to display a grid of data and I noticed this library. It works for me, but I can't find a way to merge cells horizontally or vertically. Maybe I am not reading the documentation carefully :3. Can I achieve the desired result?

Hi @ZenWhite may I ask you to provide more details on your case? what data you need to show and in what way?
I think this is possible using childComponents https://stackblitz.com/edit/table-overview-ts-nvy25w?file=Demo.tsx

Thank you for your reply! I have the task of combining rows and columns. Example of combining rows: a cell with the name of the day of the week, which can be stretched to 9/18 rows. Example of combining columns: a cell with a card, which can be combined into n columns

I added an example for rowSpan as well https://stackblitz.com/edit/table-overview-ts-uqgnqt?file=Demo.tsx (column:3 row:3 is placed into 2 rows)
let me know if this solution is sufficient for you

Thanks for the solution! I am currently modifying your code for my task in order to verify performance and operability. After all, some libraries have pretty big problems with rowSpan/colSpan. I'll write back a little later

In all the examples, you used a static list of columns. Can you tell me what I need to do to load the columns dynamically? Since it's not quite clear to me how to tie this in with the dispatch:
image
My data is displayed, but at the same time there is a strange empty space:
image