File tree Expand file tree Collapse file tree 4 files changed +95
-1
lines changed
react-bootstrap-table2-example
react-bootstrap-table2/src Expand file tree Collapse file tree 4 files changed +95
-1
lines changed Original file line number Diff line number Diff line change @@ -49,6 +49,7 @@ Available properties in a column object:
4949* [ editorRenderer] ( #editorRenderer )
5050* [ filter] ( #filter )
5151* [ filterValue] ( #filterValue )
52+ * [ searchable] ( #searchable )
5253* [ csvType] ( #csvType )
5354* [ csvFormatter] ( #csvFormatter )
5455* [ csvText] ( #csvText )
@@ -917,6 +918,9 @@ A final `String` value you want to be filtered.
917918}
918919```
919920
921+ ## <a name =' searchable ' >column.searchable - [ Boolean] </a >
922+ Default the column is searchable. Give ` false ` to disable search functionality on specified column.
923+
920924## <a name =' csvType ' >column.csvType - [ Object] </a >
921925Default is ` String ` . Currently, the available value is ` String ` and ` Number ` . If ` Number ` assigned, the cell value will not wrapped with double quote.
922926
Original file line number Diff line number Diff line change 1+ /* eslint react/prop-types: 0 */
2+ import React from 'react' ;
3+
4+ import BootstrapTable from 'react-bootstrap-table-next' ;
5+ import ToolkitProvider , { Search } from 'react-bootstrap-table2-toolkit' ;
6+ import Code from 'components/common/code-block' ;
7+ import { productsGenerator } from 'utils/common' ;
8+
9+ const { SearchBar } = Search ;
10+ const products = productsGenerator ( ) ;
11+
12+ const columns = [ {
13+ dataField : 'id' ,
14+ text : 'Product ID'
15+ } , {
16+ dataField : 'name' ,
17+ text : 'Product Name' ,
18+ searchable : false
19+ } , {
20+ dataField : 'price' ,
21+ text : 'Product Price' ,
22+ searchable : false
23+ } ] ;
24+
25+ const sourceCode = `\
26+ import BootstrapTable from 'react-bootstrap-table-next';
27+ import ToolkitProvider, { Search } from 'react-bootstrap-table2-toolkit';
28+
29+ const { SearchBar } = Search;
30+ const columns = [{
31+ dataField: 'id',
32+ text: 'Product ID'
33+ }, {
34+ dataField: 'name',
35+ text: 'Product Name',
36+ searchable: false
37+ }, {
38+ dataField: 'price',
39+ text: 'Product Price',
40+ searchable: false
41+ }];
42+
43+ <ToolkitProvider
44+ keyField="id"
45+ data={ products }
46+ columns={ columns }
47+ search
48+ >
49+ {
50+ props => (
51+ <div>
52+ <h3>Input something at below input field:</h3>
53+ <SearchBar { ...props.searchProps } />
54+ <hr />
55+ <BootstrapTable
56+ { ...props.baseProps }
57+ />
58+ </div>
59+ )
60+ }
61+ </ToolkitProvider>
62+ ` ;
63+
64+ export default ( ) => (
65+ < div >
66+ < ToolkitProvider
67+ keyField = "id"
68+ data = { products }
69+ columns = { columns }
70+ search
71+ >
72+ {
73+ props => (
74+ < div >
75+ < h3 > Column name and price is unsearchable</ h3 >
76+ < SearchBar { ...props . searchProps } />
77+ < hr />
78+ < BootstrapTable
79+ { ...props . baseProps }
80+ />
81+ </ div >
82+ )
83+ }
84+ </ ToolkitProvider >
85+ < Code > { sourceCode } </ Code >
86+ </ div >
87+ ) ;
Original file line number Diff line number Diff line change @@ -193,6 +193,7 @@ import DefaultCustomSearch from 'examples/search/default-custom-search';
193193import FullyCustomSearch from 'examples/search/fully-custom-search' ;
194194import SearchFormattedData from 'examples/search/search-formatted' ;
195195import CustomSearchValue from 'examples/search/custom-search-value' ;
196+ import SearchableColumn from 'examples/search/searchable-column' ;
196197
197198// CSV
198199import ExportCSV from 'examples/csv' ;
@@ -445,6 +446,7 @@ storiesOf('Table Search', module)
445446 . add ( 'Clear Search Button' , ( ) => < ClearSearchButton /> )
446447 . add ( 'Default Search Table' , ( ) => < DefaultSearch /> )
447448 . add ( 'Default Custom Search' , ( ) => < DefaultCustomSearch /> )
449+ . add ( 'Searchable Column' , ( ) => < SearchableColumn /> )
448450 . add ( 'Fully Custom Search' , ( ) => < FullyCustomSearch /> )
449451 . add ( 'Search Formatted Value' , ( ) => < SearchFormattedData /> )
450452 . add ( 'Custom Search Value' , ( ) => < CustomSearchValue /> ) ;
Original file line number Diff line number Diff line change @@ -161,7 +161,8 @@ HeaderCell.propTypes = {
161161 validator : PropTypes . func ,
162162 filter : PropTypes . object ,
163163 filterRenderer : PropTypes . func ,
164- filterValue : PropTypes . func
164+ filterValue : PropTypes . func ,
165+ searchable : PropTypes . bool
165166 } ) . isRequired ,
166167 index : PropTypes . number . isRequired ,
167168 onSort : PropTypes . func ,
You can’t perform that action at this time.
0 commit comments