Skip to main content
Filter by
Sorted by
Tagged with
0 votes
0 answers
65 views

Async call with react-bootstrap-table onExpand is not working

I am using react-bootstrap-table2 Row Expand Hooks. I'm trying to call function when click on the row and get data from database. However it doesn't work. I am getting all the data in console but row ...
Yevgeniy Bagackiy's user avatar
0 votes
0 answers
49 views

React BootstrapTable field editing issue

I'm using the BootstrapTable and TableHeaderColumn in an old React project. My problem is I have to make specific fields editable according to the kind of data I have in my DB, and when I set the ...
pliniocf's user avatar
  • 364
3 votes
1 answer
2k views

Does react-bootstrap-table-next compatible with React 18?

I have a existing react 17 application, which needs to migrate react 18. So when migrating I faced compatible issue with react-bootstrap-table-next. "While resolving: react-bootstrap-table-next@4....
TChami's user avatar
  • 31
1 vote
1 answer
226 views

react-bootstrap-table: Column formatter is not re-rendering

I have the following column formatter: // const [shouldShowCancel, setShouldShowCancel] = useState(false); function nameColumnFormatter(cell, row) { var shouldShowCancel = false; return ( ...
Niko's user avatar
  • 753
1 vote
0 answers
218 views

I want to add a custom Header to a CSV file that I get from exportCSV of react-bootstrap-table2-toolkit

I want to add a custom Header to a CSV file that I get from exportCSV of react-bootstrap-table2-toolkit Documentation: https://react-bootstrap-table.github.io/react-bootstrap-table2/storybook/index....
DIVYA BAID's user avatar
1 vote
0 answers
280 views

How to use map with react-bootstrap-table-next

I'm trying to use add sorting and pagination to a HTML table by using react-bootstrap-table. I'm able to make it work on all fields except the last column where I need to map an array that has a link ...
Oregano's user avatar
  • 11
0 votes
1 answer
175 views

the input text box focus is getting exited while navigating to the second page react-bootstrap-table2-toolkit

I am using: "react-bootstrap-table-next": "4.0.3", "react-bootstrap-table2-paginator": "^2.1.2", "react-bootstrap-table2-toolkit": "^2.1.3", ...
Gourav's user avatar
  • 1
0 votes
0 answers
49 views

How to export react-bootstrap table in to pdf

I have a react-bootstrap table and I need to export table data to a pdf. 'useReactToPrint' along with useRef is not working properly. Any other method campatible with react-bootstrap table? Generate a ...
Sinera Wijethunga's user avatar
0 votes
1 answer
594 views

bootstrap-table with symfony 6 throught webpack not compiling

I'm trying to update a symfony project and its nodes plugins. I just discovered that when running my app, I get a webpack error about Uncaught bootstrap (not working after that) table saying TypeError:...
matt's user avatar
  • 1
0 votes
1 answer
108 views

How to get the filtered data in bootstrap datatable while using React.js by entering in search box?

I am using bootstrap datatable in my React application function MyApp(){ const tableRef = useRef(null); const [tableSave, setTableSave] = useState(null) const [dataFromAPI, setDataFromAPI] = useState(...
Ghias Ali's user avatar
  • 327
-1 votes
1 answer
706 views

Change font color of inside the react bootstrap striped table

I am using this react bootstrap table with striped rows. According to the docs, I can "Invert the colors of the table — with light text on dark backgrounds by setting variant as dark." ...
ragmats's user avatar
  • 111
0 votes
3 answers
60 views

fetching data not showing in table in react

I am creating a table and fetching data using Axios. However, I am not able to print the data – when I check, the data is being printed in the browser, but I am not able to print the particular data ...
Sougata Mukherjee's user avatar
0 votes
2 answers
718 views

Why isn't react-bootstrap table not working

i wanted to create a table using react-bootstrap .so installed react-bootstrap by npm install react-bootstrap boostrap then i imported the Table from react-bootstrap and rendered the table but it is ...
Hamdan Salih's user avatar
1 vote
1 answer
229 views

Is there a way to use validation on the textFilter of react-bootstrap-table2-filter?

Below is the object I use. { dataField: "hostname", text: "hostName", filter: textFilter({ placeholder: t("hostName"), ...
yokus's user avatar
  • 173
1 vote
0 answers
337 views

Enable Disable multiple checkboxes in React Bootstrap Table Next

I'm having a hard time trying to enable/disable checkboxes using Bootstrap Table Next and React. For the checkboxes I'm using a column formatter like this: formatter: (cell, row) => { ...
Mick's user avatar
  • 46
-2 votes
1 answer
652 views

I cant add react-bootstrap to NextJS

I cant use React-bootstrap to NextJS I've added import 'bootstrap/dist/css/bootstrap.min.css' in _app.tsx and yarn add Please help me, i'm newbie import Container from 'react-bootstrap/Container'; ...
Yun's user avatar
  • 7
1 vote
0 answers
108 views

How expand table row on right click using react-bootstrap-table2

The library has an expandRow props, it expands by default when the left mouse button is clicked, how can I make it expand when the right mouse button is clicked?
p1e0's user avatar
  • 53
-1 votes
2 answers
929 views

Adding column header for the row selection column in the react-bootstrap-table-next?

Question How can I add column header for the row selection in the react-bootstrap-table-next? Screenshots Design Image Current Code Image Here is the Image for the table I just need to know that how ...
Coder's user avatar
  • 102
0 votes
1 answer
755 views

react-bootstrap-table2 pagination is not working with useState

I am using react-bootstrap-table2 pagination in my react application.I am using a state to update the sizePerPage dynamically.But it is not working. When I console the state, I am able to see the ...
ajo's user avatar
  • 15
0 votes
2 answers
3k views

how to load data in react-bootstrap-table partially by using pagination

I am getting data partially from backend (let's say 10 rows per api call) and I want to call the api on page change but I am unable to find any relevant option in react-bootstrap-table pagination. Is ...
M Maaz Azhar's user avatar
0 votes
1 answer
123 views

The value in the td tag is not correspondingly above table head (react-bootstrap)

I am trying to create a table in reactjs using bootstrap. Everything seems fine except: As you can see, the titles inside the thead tag is not aligned exactly above its corresponding td tag. Is there ...
Sadeed_pv's user avatar
  • 559
0 votes
1 answer
171 views

react-bootstrap-table can't access sub object

How can I access sub object in react-bootstrap-table I am trying to use react-bootstrap-table in my project. My data object looks something like below- const features = [ { id:1, name:'Name ...
viparvez's user avatar
0 votes
1 answer
571 views

Mapping to React Modal renders all items from array instead of mapping by their ID

My issue is that when I map the data into the Modal, it is returning all items from that field in the array e.g. mapping Business Name will return all business names in the array instead of 1. I am ...
It hurts when IP's user avatar
1 vote
0 answers
99 views

Received `true` for a non-boolean attribute `show`

I created a bootstrap-table, that onClick of the row, a modal pops-up showing an information of items in the row. This works fine, but when I click on the row, the browser's console shows this error. ...
Joca's user avatar
  • 125
-1 votes
1 answer
862 views

How to use react-select-table's rows as options to react-select's input field

I have an input field that should accept multiple inputs from options that are already set. - This input field needs to appear like tag input fields so I used the React-select library: The set ...
L.Diaz's user avatar
  • 51
-1 votes
1 answer
1k views

Add tooltips on column headers in a React Bootstrap table

<BootstrapTable bordered={false} hover={true} wrapperClasses="responsive" keyField="id" data={products} columns={columns} {...props.baseProps} // ref={(n) => (this.node = n)...
Keerthi's user avatar
  • 51
0 votes
1 answer
303 views

State lost value in bootstrap table

I am using custom fields in react bootstrap table. { dataField: "hours", text: "# of Hours", sort: true, footer: "# of Hours", headerStyle: (colum, colIndex) =&...
zeeshan zahoor's user avatar
1 vote
0 answers
680 views

How to make afterSaveCell in react bootstrap table save values to database

I am using react-bootstrap-table-next to implement crud functionalities. I need a situation whereby after the inline editing is done the data is saved to the database. Right now, after reloading the ...
Joca's user avatar
  • 125
0 votes
1 answer
357 views

Ttrying to load a table using react-bootstrap-table

Trying to edit the table cells using react-bootstrap-table, I am able edit successfully, but when I click on other components in the page the edited content has been restored by original value. export ...
kesav murthi's user avatar
4 votes
2 answers
5k views

react-bootstrap-table-toolkit Search Import Error

I wanted to use React Bootstrap Table in my project and I'm getting the following error. Uncaught ReferenceError: arguments is not defined at Object../node_modules/react-bootstrap-table2-toolkit/lib/...
Narek Grigoryan's user avatar
1 vote
2 answers
1k views

Uncaught TypeError: Cannot read properties of undefined (reading 'start_time')

I am facing this error when I update my last end time of last interval although it updates my state but not showing it in table const onEdit = (oldValue, newValue, row, column) => { const ...
Fashad Ahmed's user avatar
0 votes
1 answer
1k views

Table react bootstrap component rendering from array

I want to render a Table component with N rows, where N corresponds to a given array lenght, and for each row there will be two columns: the 1st one with a parameter of the array of objects and the ...
Paganini's user avatar
0 votes
1 answer
2k views

react-bootstrap-table-next onclick(row) not providing correct key/value information

I'm attempting to add an onClick() event to a cell in a row so that I can get the keyField value for that row when the cell is clicked. This functionality worked initially, then I started getting ...
ggfuzzy's user avatar
  • 11
2 votes
0 answers
311 views

mdbreact datatable pagination issue

Im using mdbreact package to display the data in a datatable. In the datatable I have a column with checkbox to change the value. When I check or Uncheck and move to the second page, the values of the ...
Minsaf's user avatar
  • 264
0 votes
1 answer
217 views

IntelliJ reporting typescript error for react-bootstrap-table-next

I'm using react-bootstrap-table-next (aka react-bootstrap-table2). I'm getting a Typescript error in IntelliJ on the validator field in my column definition. I can't seem to get around it in IntelliJ ...
Peter Kronenberg's user avatar
1 vote
1 answer
1k views

ExportCSV using react-bootstrap-table-2

I'm trying to trigger my exportCSV from a different component outside of the TookkilProvider... is that possible? I did see some reference to this.refs.table.handleExportCSV(); here, but I can't seem ...
JoelE's user avatar
  • 309
2 votes
0 answers
1k views

How do I make my react-bootstrap-table-next maintain the same column width for all screen resolutions (Mobile responsive)?

I am using the BootstrapTable component from react-bootstrap-table-next. I am trying to create a page where this table must use the entire width of the screen. If the screen resolution drops down to ...
Sachin Prasanna.M.L's user avatar
1 vote
1 answer
935 views

How to specify keys in React Bootstrap table

Using React Bootstrap table, I'm getting the warning Warning: Each child in a list should have a unique "key" prop. I've read about how this is necessary for lists, but not sure where I'm ...
Peter Kronenberg's user avatar
1 vote
2 answers
2k views

How to dynamically disable a row's checkbox in react-bootstrap-table2?

I want to achieve something that is in my current sandbox: Currently I've hardcoded the nonSelectable: [1, 2] so it will make row 1 and 2 unselectable. Now I want to make the rows unselectable based ...
Lance's user avatar
  • 247
0 votes
1 answer
988 views

React-Bootstrap Table with dynamic Content - Form over Radio Buttons in Rows not working

In my React App I request data from an API and store it in state: const [entities, setEntities] = useState([]); in my useEffect hook I get the Data from the API - basicly I have the following example ...
KilledByCHeese's user avatar
1 vote
2 answers
2k views

Adding serial number to the react bootstrap table

I am using a React-bootstrap table in my project, I want to add a column in my table with a serial number but am unable to generate the serial number so kindly guide me on how to do it. Currently am ...
Jatin Panday's user avatar
-1 votes
1 answer
779 views

How to hide data rows with certain value with a button?

I use react-bootstrap-table-next. And want to use a toggle button which hide or show rows with a certain value. But the problem is that the table content doesn't change. import BootstrapTable from '...
ikreb's user avatar
  • 2,690
2 votes
1 answer
404 views

How do I use search in react?

I want to search by holiday name on the holiday list coming from the API. The user should be able to select the line with the name of the holiday s/he is looking for by clicking on it after seeing it ...
efnan's user avatar
  • 48
0 votes
0 answers
652 views

How do I edit an array inside a cell in my React-bootstrap table?

As shown in the link below. I have an array inside a cell, when a click on those cell to edit them, they turns to [object, object] instead of their default values. The first picture shows the error ...
Ilias SANATI's user avatar
0 votes
0 answers
378 views

Modal always re-rendering when typing in input for React-Bootstrap-Table2

I'm trying to implement an 'Edit Category' modal that can edit the current selected row in React-Bootstrap-Table2. However, when I tried to type in Category Description, it always re-renders the modal ...
Lance's user avatar
  • 247
1 vote
0 answers
760 views

How to pass row data to a child component created into a format function

I have a react-bootstrap table with column defined like this: const columns = [ ... { dataField: "d", text: "Actions", formatter: actionFormatter, ...
Kimor's user avatar
  • 602
1 vote
1 answer
2k views

Uncaught RangeError: Invalid time value on react-DatePicker

I have a React component as Form which has some text input and a DatePicker control. I display the inputs on a table using react-bootstrap-table-next library, which can't display date directly form ...
PineCone's user avatar
  • 2,343
0 votes
1 answer
251 views

Uncaught Error: Objects are not valid as a React child while using react-bootstrap-table-next

I have a React component where I am trying to render a table using the react-bootstrap-table-next library. I'm getting an error: Uncaught Error: Objects are not valid as a React child Issue: The ...
PineCone's user avatar
  • 2,343
2 votes
1 answer
178 views

<Table> in react-bootstrap - SyntaxError

I'm working on a React project using react-bootstrap, and having a problem when trying to add JSX before of after the <Table> part. Someone familiar with that problem? return ( <h1&...
Yonatan's user avatar
  • 21
0 votes
1 answer
6k views

How to add columns filter using react-bootstrap/table?

I want to add the ability to sort/filter the columns of my table. On the web I can't find any example on how to do that with react-bootstrap/table. Here is my code: import React from 'react'; import '...
J.erome's user avatar
  • 758

1
2 3 4 5
8