CODEWITHSUNDEEP
javascripthtmlreactjsreact-bootstrapreact-bootstrap-table
SeanPlusPlus
SeanPlusPlus

Reputation: 9033

Add anchor to react bootstrap table

The React Bootstrap Table documents provide an example of how to select a row.

However, I do not see any mention of how to wrap a row in an anchor tag (or a click handler), so that when a user clicks on a table row, they are then redirected to a new url.

How do I do this? Thanks!

Additionally, I see that in an onRowSelect, you could do a window.location = ______.

However, the mode: radio/checkbox is required, and that means the table will have that additional column with a radio/checkbox. Which, for this use case (just redirecting on click) feels superfluous.

Upvotes: 2

Views: 924

Answers (1)

SeanPlusPlus
SeanPlusPlus

Reputation: 9033

Woohoo! Got it! You can add the attribute hideSelectColumn: true and you will be able to register the click callback, and won't have that extra column of radio elements!

var selectRowProp = {
  mode: "radio",
  hideSelectColumn: true,
  clickToSelect: true,
  bgColor: "rgb(238, 193, 213)",
  onSelect: onRowSelect
};

Upvotes: 1

Related Questions