From React-Module-Project created by SallyMcGrath: CodeYourFuture/React-Module-Project#15
Highlight booking row when clicked
Instructions:
Within the <SearchResults /> component or its child components, add an onClick handler to each row in the table (hint: on the <tr> element). When clicked, the row is "selected" and highlighted with a different colour. When clicked again, the row is unselected and the coloured highlighting is removed.
Hint: Use a new state variable for each row to record if the row is selected or not, and use this value to set a class to the className prop of the row.
Test:
[ ] Verify that each row of your table can be highlighted (on and off) independently when being clicked.
From React-Module-Project created by SallyMcGrath: CodeYourFuture/React-Module-Project#15
Highlight booking row when clicked
Instructions:
Within the
<SearchResults />
component or its child components, add anonClick
handler to each row in the table (hint: on the<tr>
element). When clicked, the row is "selected" and highlighted with a different colour. When clicked again, the row is unselected and the coloured highlighting is removed.Hint: Use a new state variable for each row to record if the row is selected or not, and use this value to set a class to the
className
prop of the row.Test: