As the title says I would like to place the search bar for react-bootstrap-table
to the left instead of to the right as default.
Example can be found here, look at the bottom of the page:
https://allenfang.github.io/react-bootstrap-table/example.html#others
I have seen in docs that you can create your own search panel and input but that seems like a big workaround when I only wan't to position the search field to the left.
http://allenfang.github.io/react-bootstrap-table/custom.html#searchpanel
Current code:
options: Options = {
defaultSortName: 'Id',
defaultSortOrder: 'desc',
noDataText: 'Empty',
onRowClick: this.onRowClick.bind(this)
};
render() {
return (
<div>
<BootstrapTable containerStyle={{ marginTop: '10px' }} data={this.state.tableCases} options={this.options} striped={true} hover={true} search multiColumnSearch>
<TableHeaderColumn dataField='Id' isKey={true} dataSort={true}>Case ID</TableHeaderColumn>
<TableHeaderColumn dataField='CompanyName' dataSort={true}>Company Name</TableHeaderColumn>
<TableHeaderColumn dataField='Title' dataSort={true}>Title</TableHeaderColumn>
<TableHeaderColumn dataField='Family' dataSort={true}>Family</TableHeaderColumn>
<TableHeaderColumn dataField='ApplicationDate' dataSort={true}>Application Date</TableHeaderColumn>
</BootstrapTable>
</div>
);
}
Solved it like this: