react-bootstrap-table2 Features

Hi @AllenFang ,

Hope you are doing well.

I've been doing a lot of research on various react-table libraries and wanted to provide a bit of feedback/questions. First, I think you have done a great job of React-Bootstrap-Table2, I've used it heavily in my project.

I was curious though, if React-Bootstrap-Table2 allows you (the developer) to add a button within each row (i.e. An edit button). I have a table and the I'd like to select a row and open a new webpage to edit the data of that row.

Is there the ability to create tables within a table (i.e. sub-components show in React-Table)?

Is there anyway to have a fixed header with a vertical scroll?

Feb 27 '18 03:02 ashwaths0793

+1 for a fixed header with a vertical scroll. That would be really useful. By the way, @ashwaths0793 were you able to solve this by any means ?

Mar 01 '18 07:03 krupatel

Hey guys, sorry for lately reply,

if React-Bootstrap-Table2 allows you (the developer) to add a button within each row (i.e. An edit button)

sure, same as legacy react-bootstrap-table, we still have dataFormat in react-bootstrap-table2

Is there the ability to create tables within a table (i.e. sub-components show in React-Table)?

We dont have this feature but we have expandrow in legacy react-bootstrap-table, and most of people will put a sub table in expanding row. We will implement expand row ASAP, but if anyone have a good suggestion for sub table, it's very welcome :)

Is there anyway to have a fixed header with a vertical scroll? In legacy react-bootstrap-table we have, but in react-bootstrap-table2, I can't promise this due to there're too many unalign issues if people enable the vertical scroll bar. However, I will still working on this issue

Please let me know if you have any questions, thanks :)

Mar 03 '18 04:03 AllenFang

Hey Allen,

No worries. You are the man. I'm just getting started learning React and your input/advice has been incredible.

Thanks for everything.

Mar 03 '18 13:03 ashwaths0793

Expandable row support on [email protected] and [email protected].

https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/basic-row-expand.html

Aug 04 '18 08:08 AllenFang

Hi @AllenFang is there any way to fix the header of the table while scrolling ? i am using react-bootstrap-table-next.

Aug 28 '18 09:08 harmeet27

@harmeet27 see fixed header option using pure css @ https://github.com/react-bootstrap-table/react-bootstrap-table2/issues/409

Oct 02 '18 19:10 BlaineBradbury

Hi @AllenFang , is there any update on fixed header feature in react-bootstrap-table2 ? Or any workaround that we can try? Thank you.

Dec 26 '18 10:12 dilushi

I have achieved this using CSS here's my code: My Bootstrap table id is "mapping_table". You may need to change the width that is mentioned as 98.7% as per your table to get your headers aligned properly. #mapping_table tbody { display:block; height:200px; overflow-y:scroll; } #mapping_table thead{ display:table; width:98.7%; table-layout:fixed; } #mapping_table tbody tr { display:table; width:100%; table-layout:fixed; }

Feb 28 '19 11:02 akash-more

@ashwaths0793 I tried this CSS options and it works great for fixed column widths scrolling vertically. I wanted to create a way where I can scroll horizontally as well. Is that possible?

Also it seems that I need table-layout: fixed in order for this work. I'm in a situation where I have 15-20 columns and I want to be able to auto-resize the columns based.