question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Missing Data values when adding static headers on multiple rows.

See original GitHub issue

@AllenFang Hello Allen, (Thanks for the awesome library.) The below screenshot is my output of table with related data that shows up correctly when I removed the extra TableHeaders i used as static rows… But i want my table to look like the 2nd image.

screen shot 2017-11-05 at 5 24 51 pm

screen shot 2017-11-05 at 5 25 04 pm

Once i add the extra table headers to generate the a/b/c/d headers, the data doesn’t display. I want the empty rows to appear after the a/b/c/d text cells. Not sure how i should go about resolving this issue. The sample data i used just contained numbers to print thats all. Any help would be greatly appreciated. Thanks for your time.

I have attached my code snippet. ` <BootstrapTable data={testData} version={‘4’} striped={true} hover={true} > <TableHeaderColumn row='0' rowSpan='3' colSpan='6' headerAlign='center'>Test Table</TableHeaderColumn>

					<TableHeaderColumn row='0' colSpan='20' headerAlign='center' thStyle={ { background: 'Gainsboro' } }> 1</TableHeaderColumn>
					<TableHeaderColumn row='0' colSpan='20' headerAlign='center'  >2</TableHeaderColumn>

					<TableHeaderColumn row='1' colSpan='10' headerAlign='center' dataField='check' > 1</TableHeaderColumn>
					<TableHeaderColumn row='1' colSpan='10' headerAlign='center'> 2</TableHeaderColumn>

					<TableHeaderColumn row='1' colSpan='10' headerAlign='center'> 3</TableHeaderColumn>
					<TableHeaderColumn row='1' colSpan='10' headerAlign='center'> 4</TableHeaderColumn>

					<TableHeaderColumn row='2' colSpan='2' headerAlign='center' >11/1</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/2</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center' dataField='id' isKey={ true } dataAlign='center'>11/3</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/4</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/5</TableHeaderColumn>

					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/6</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/7</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/8</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/9</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/10</TableHeaderColumn>

					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/11</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/12</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/13</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/14</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/15</TableHeaderColumn>

					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/16</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/17</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/18</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/19</TableHeaderColumn>
					<TableHeaderColumn row='2' colSpan='2' headerAlign='center'>11/20</TableHeaderColumn>

					<TableHeaderColumn row='3' colSpan='3' headerAlign='center'>A</TableHeaderColumn>
					<TableHeaderColumn row='3' colSpan='3' headerAlign='center'>B</TableHeaderColumn>
					<TableHeaderColumn row='4' colSpan='3' headerAlign='center'>c</TableHeaderColumn>
					<TableHeaderColumn row='4' colSpan='3' headerAlign='center'>d</TableHeaderColumn>

				</BootstrapTable>`

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
arunmmanoharancommented, Mar 22, 2018

@AllenFang Does the table support colspan now? Like to have a row that spans across 4 columns?

1reaction
AllenFangcommented, Nov 8, 2017

oh~ sorry that I miss understand your question lol About your requirement, react-bootstrap-table2 not support yet, currently we only support span on header. But react-bootstrap-table2 will support it as well, but need some time 😃

Read more comments on GitHub >

github_iconTop Results From Across the Web

Missing Data values when adding static headers on multiple ...
I want the empty rows to appear after the a/b/c/d text cells. Not sure how i should go about resolving this issue. The...
Read more >
Mark Empty values in Pandas DataFrame Multi-Row Header
Is there a way to not display the missing values - to remove the Unnamed: x_level_y or substitute it with a meaningful value?...
Read more >
Chapter 3 Multi-Row Headers | Tutorials - PsyTeachR
When I tried to load the data, I realised the first three rows were all header rows. Here's the code I wrote to...
Read more >
Show or Hide Missing Values or Empty Rows and Columns
To show missing values in a range, right-click (control-click on Mac) the date or bin headers and select Show Missing Values. Note: You...
Read more >
Turn Excel table headers on or off - Microsoft Support
When you create an Excel table, a table Header Row is automatically added as the first row of the table, but you have...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found