Merge pull request #1541 from FlyBase/#1540

add configurable toolbar fixes #1540
AllenFang · Aug 18, 2017 · 29bbecc · 29bbecc
2 parents 31de45d + 31c80e1
commit 29bbecc
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 1 deletion.
diff --git a/src/BootstrapTable.js b/src/BootstrapTable.js
@@ -399,6 +399,7 @@ class BootstrapTable extends Component {
     const colGroups = Util.renderColGroup(columns, this.props.selectRow, expandColumnOptions, this.props.version);
     let sortIndicator = this.props.options.sortIndicator;
     if (typeof this.props.options.sortIndicator === 'undefined') sortIndicator = true;
+
     const { paginationPosition = Const.PAGINATION_POS_BOTTOM } = this.props.options;
     const showPaginationOnTop = paginationPosition !== Const.PAGINATION_POS_BOTTOM;
     const showPaginationOnBottom = paginationPosition !== Const.PAGINATION_POS_TOP;
@@ -407,10 +408,14 @@ class BootstrapTable extends Component {
       selectRow.clickToSelect = false;
     }
 
+    const { toolbarPosition = Const.TOOLBAR_POS_BOTTOM } = this.props.options;
+    const showToolbarOnTop = toolbarPosition !== Const.TOOLBAR_POS_BOTTOM;
+    const showToolbarOnBottom = toolbarPosition !== Const.TOOLBAR_POS_TOP;
+
     return (
       <div className={ classSet('react-bs-table-container', this.props.className, this.props.containerClass) }
         style={ this.props.containerStyle }>
-        { toolBar }
+        { showToolbarOnTop ? toolBar : null }
         { showPaginationOnTop ? pagination : null }
         <div ref='table'
             className={ classSet('react-bs-table', { 'react-bs-table-bordered': this.props.bordered }, this.props.tableContainerClass) }
@@ -485,6 +490,8 @@ class BootstrapTable extends Component {
         </div>
         { tableFilter }
         { showPaginationOnBottom ? pagination : null }
+
+        { showToolbarOnBottom ? toolBar : null }
         <Alert stack={ { limit: 3 } } />
       </div>
     );
@@ -1536,6 +1543,11 @@ BootstrapTable.propTypes = {
       Const.PAGINATION_POS_BOTTOM,
       Const.PAGINATION_POS_BOTH
     ]),
+    toolbarPosition: PropTypes.oneOf([
+      Const.TOOLBAR_POS_TOP,
+      Const.TOOLBAR_POS_BOTTOM,
+      Const.TOOLBAR_POS_BOTH
+    ]),
     hideSizePerPage: PropTypes.bool,
     hidePageListOnlyOnePage: PropTypes.bool,
     alwaysShowAllBtns: PropTypes.bool,
@@ -1700,6 +1712,7 @@ BootstrapTable.defaultProps = {
     sizePerPage: undefined,
     paginationSize: Const.PAGINATION_SIZE,
     paginationPosition: Const.PAGINATION_POS_BOTTOM,
+    toolbarPosition: Const.TOOLBAR_POS_TOP,
     hideSizePerPage: false,
     hidePageListOnlyOnePage: false,
     alwaysShowAllBtns: false,

diff --git a/src/Const.js b/src/Const.js
@@ -24,6 +24,9 @@ const CONST_VAR = {
   PAGINATION_POS_TOP: 'top',
   PAGINATION_POS_BOTTOM: 'bottom',
   PAGINATION_POS_BOTH: 'both',
+  TOOLBAR_POS_TOP: 'top',
+  TOOLBAR_POS_BOTTOM: 'bottom',
+  TOOLBAR_POS_BOTH: 'both',
   NO_DATA_TEXT: 'There is no data to display',
   SHOW_ONLY_SELECT: 'Show Selected Only',
   SHOW_ALL: 'Show All',