I want to assign the packages i.e. selected by the user but it is displaying form in all the trs.
// Binding of showForm()
constructor(props) {
super(props);
this.showForm = this.showForm.bind(this); // bind of show function
this.state = {
packages: [],
showForm: false
};
}
// UI for showForm : to be displayed after handling on click
showForm = () => {
return (
<div>
<form >
</form>
</div>
);
}
// table : displaying data coming from firebase had been implemented
<tbody>``
...
<tr key={pack.uid} onClick={() => this.setState({showForm: true}) } > // chnging state
<td>
<button type="button" value = {pack.name} className="btn btn-secondary">
Assign
</button>
{this.state.showForm ? this.showForm() : null} // maintaiing state
</td>
</tr>
))}``
</tbody>
