Stack Overflow
Stack Overflow

Questions tagged [react-bootstrap-table]

react-bootstrap-table (now react-boostrap-table2) is a react.js table based on the bootstrap's style. It's a configurable, functional table component and make you build a Bootstrap Table more efficiency and easy in your React application.

react-bootstrap-table is a react.js table plugin based on the bootstrap's style. It's a configurable, functional table component and make you build a Bootstrap table more efficiency and easy in your React application. Currently, react-boostrap-table is on version 2 after the original project/version became deprecated.

Here is a partial list of supported features:

  • striped, borderless, condensed table
  • column align, hidden, width, sort, title
  • scrolling table
  • cell format
  • pagination
  • row selection
  • column filter with multi type
  • cell edit with multi type editor
  • insert & delete Row
  • table, row and column styling
  • global search
  • export to CSV
  • rich function hooks
  • large columns table
  • header column span
  • remote mode
  • expandable row
379 questions
0
votes
2 answers

How to make a row editable on click of a button in React bootstrap table?

I want to make a row editable in a react bootstrap table on click of a button, how can I do it, I am new to React.
Akash More
  • 62
  • 1
  • 9
0
votes
4 answers

Sorting number with comma in react-bootstrap-table2

Using react-bootstrap-table2, When trying to filter large numbers with commas (12,000) it doesn't work. Is it possible to filter numbers with commas? example Cheers!
Gearóid
  • 179
  • 1
  • 3
  • 11
0
votes
2 answers

react-bootstrap-table2 how to handle large display in expanded row

I have a table with some columns to display a Product and its prices. On my main table a line is composed of the product name and the min and max prices from the other company shops. When I click on a line I expand it to display some details about…
Alk
  • 658
  • 2
  • 12
  • 23
0
votes
1 answer

How could I get the total of a column in a react bootstrap table? ReactJS

The problem is the following, I have a component that receives the props from the father. The issue is that I know how to get the info that comes to me but I can not add the total of a column. I had tried with _.sumby but I think I'm not using it as…
Apol0x
  • 21
  • 4
0
votes
0 answers

react-bootstrap-table - column with own data (not from dataset)

Hello I have a table with some columns, data is taken from an API. Now I need to add another column where I will add a button with my own functionality (different functionality for each row). Can I somehow do it?
jake-ferguson
  • 315
  • 3
  • 11
  • 32
0
votes
1 answer

react-bootstrap-table - own number of pagination items

I am using BootstrapTable from react-bootstrap-table and taking data from external API. Each time I get an object of 30 items. Therefore the pageSize is 30 but I get the totalPages variable from API which is let's say 6. Unfortunately, the table…
jake-ferguson
  • 315
  • 3
  • 11
  • 32
0
votes
3 answers

How to use the moment library in React Bootstrap table's column definition?

My code looks as following: const columns = [{ dataField: 'Id', text: 'Order ID' }, { dataField: 'Date', text: 'Date' }, { dataField: 'Total', text: 'Total' }]; And it displays date in React Bootstrap table. But, the date is in Json…
tesicg
  • 3,971
  • 16
  • 62
  • 121
0
votes
1 answer

Redux Store and nested JSON from Axios API

I tried every possible variation of this code, but I don't really manage to get whatever the API fetched into my data store. I am absolutely stuck and would appreciate some help. I think I just don't get the essential part of this construct and I…
cesco
  • 53
  • 8
0
votes
1 answer

Assign object {row} to state

I'm trying to migrate my application which currently uses react-bootstrap-table to react-bootstrap-table-next but I'm having a problem. What I am trying to do: is to get the object of the selected line. My code const selectRow = { mode:…
Denis Correia
  • 1
  • 1
0
votes
2 answers

Table header is not aligned and this.setState is not working within private method in ReactJS

The Bootstrap Table header is not aligned with the data, am I missing any style? I'm using import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table'; I have marked in the attached picture where this.setState is not working in a…
Mostafa
  • 169
  • 1
  • 3
  • 12
0
votes
1 answer

How to customise single row on the basis of sorting in react-bootstrap-table

I am trying to give background color to rows according to column status. But unable to do so. Data is coming from json. Date …
Manish
  • 393
  • 1
  • 5
  • 20
0
votes
1 answer

Fetch and display data on React bootstrap Table

Hello guys i am trying to display my data from my api here my Json response : { "id": 1, "name": "Chicken Wings", "product_category": { "name": "Starter" }, "short_description": "Delicious Chicken Wings", "image":…
Mickael Zana
  • 261
  • 2
  • 6
  • 22
0
votes
1 answer

react-bootstrap-table set table columns total in state

I have implemented following example of react-bootstrap-table: https://stackblitz.com/edit/react-kr8ef2 I want to store the total in react state. How to set state?
Sameer Thite
  • 2,189
  • 2
  • 10
  • 13
0
votes
1 answer

Pulling data from API into react-bootstrap-table-2

I'm pulling in data from an API and trying to display it on my bootstrap table. It displays but I'm getting some errors. The first issue is in regard to 'data' being required. The second issue seems to be the data hasn't loaded in time but I've…
Gearóid
  • 179
  • 1
  • 3
  • 11
0
votes
2 answers

Pagination not working in react-bootstrap-table2

I am using react-bootstrap-table2-paginator for adding Pagination to my BootstrapTable. I get the below error when I add the Pagination part in the table. Am I missing some imports or something ? invariant.js:39 Uncaught Error: a.render(): A valid…
Midhun Mathew Sunny
  • 1,271
  • 4
  • 17
  • 30
1 2 3
…
25 26