From b0446a54cbafc85c04fc33cde695fc2d0c5850f4 Mon Sep 17 00:00:00 2001 From: Daniel O'Connor Date: Sat, 26 Apr 2025 03:57:11 +0000 Subject: [PATCH 1/6] Remove ability to configure pull-right or pull-left --- dist/bootstrap-table.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dist/bootstrap-table.js b/dist/bootstrap-table.js index 0680d417f4..c5126765dc 100644 --- a/dist/bootstrap-table.js +++ b/dist/bootstrap-table.js @@ -8558,7 +8558,7 @@ } this.$toolbar.html(''); if (typeof opts.toolbar === 'string' || _typeof(opts.toolbar) === 'object') { - $(Utils.sprintf('
', this.constants.classes.pull, opts.toolbarAlign)).appendTo(this.$toolbar).append($(opts.toolbar)); + $('
').appendTo(this.$toolbar).append($(opts.toolbar)); } // showColumns, showToggle, showRefresh From a9096cc5ec1b523b17646c926e3dcba1de6bdfb6 Mon Sep 17 00:00:00 2001 From: Daniel O'Connor Date: Sat, 26 Apr 2025 03:57:56 +0000 Subject: [PATCH 2/6] Remove ability to configure pull-right or pull-left --- src/bootstrap-table.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/bootstrap-table.js b/src/bootstrap-table.js index 0b95a258a9..edbe64090f 100644 --- a/src/bootstrap-table.js +++ b/src/bootstrap-table.js @@ -621,7 +621,7 @@ class BootstrapTable { this.$toolbar.html('') if (typeof opts.toolbar === 'string' || typeof opts.toolbar === 'object') { - $(Utils.sprintf('
', this.constants.classes.pull, opts.toolbarAlign)) + $('
') .appendTo(this.$toolbar) .append($(opts.toolbar)) } From 128dbd3ee0f212806bfb8304d4e2582fcde456e5 Mon Sep 17 00:00:00 2001 From: Daniel O'Connor Date: Sat, 26 Apr 2025 04:00:48 +0000 Subject: [PATCH 3/6] Add BC break docs --- CHANGELOG.md | 6 ++++++ index.d.ts | 1 - src/constants/index.js | 1 - 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index a2f9bd9781..13bcda6f21 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,12 @@ ChangeLog --------- +### Next + +#### Breaking changes in 1.25.x + +- Remove `toolbarAlign` in favour of flexbox. To migrate, simply add CSS. IE if you previously specified left; the same effect is possible via `.bs-bars { margin-right: auto }` + ### 1.24.1 #### Core diff --git a/index.d.ts b/index.d.ts index feb021ebe3..86f5b4644d 100644 --- a/index.d.ts +++ b/index.d.ts @@ -213,7 +213,6 @@ export interface BootstrapTableOptions { searchOnEnterKey?: boolean; searchText?: string; responseHandler?: (res: any) => any; - toolbarAlign?: string; paginationParts?: string[]; cardView?: boolean; showSearchButton?: boolean; diff --git a/src/constants/index.js b/src/constants/index.js index b521fc40d0..8c7e58b55f 100644 --- a/src/constants/index.js +++ b/src/constants/index.js @@ -291,7 +291,6 @@ const DEFAULTS = { strictSearch: false, theadClasses: '', toolbar: undefined, - toolbarAlign: 'left', totalField: 'total', totalNotFiltered: 0, totalNotFilteredField: 'totalNotFiltered', From 8bb01a6c3c57965942a0d442b4a204df798d7f8e Mon Sep 17 00:00:00 2001 From: Daniel O'Connor Date: Sat, 26 Apr 2025 04:01:31 +0000 Subject: [PATCH 4/6] Add BC break docs --- CHANGELOG.md | 2 +- site/docs/api/table-options.md | 14 -------------- 2 files changed, 1 insertion(+), 15 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 13bcda6f21..22a0b8bc07 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,7 +5,7 @@ ChangeLog #### Breaking changes in 1.25.x -- Remove `toolbarAlign` in favour of flexbox. To migrate, simply add CSS. IE if you previously specified left; the same effect is possible via `.bs-bars { margin-right: auto }` +- Remove `toolbarAlign` in favour of flexbox. To migrate, simply add CSS. IE if you previously specified left alignment, using Bootstrap; the same effect is possible via `.bs-bars { margin-right: auto }` ### 1.24.1 diff --git a/site/docs/api/table-options.md b/site/docs/api/table-options.md index eb14cea0c3..dc0dfe7013 100644 --- a/site/docs/api/table-options.md +++ b/site/docs/api/table-options.md @@ -1825,20 +1825,6 @@ The table options are defined in `jQuery.fn.bootstrapTable.defaults`. - **Example:** [Custom Toolbar](https://examples.bootstrap-table.com/#options/custom-toolbar.html) -## toolbarAlign - -- **Attribute:** `data-toolbar-align` - -- **Type:** `String` - -- **Detail:** - - Indicate how to align the custom toolbar. `'left'`, `'right'` can be used. - -- **Default:** `'left'` - -- **Example:** [Toolbar Align](https://examples.bootstrap-table.com/#options/toolbar-align.html) - ## totalField - **Attribute:** `data-total-field` From 85c440cd2d0ad0281de604192824314769876107 Mon Sep 17 00:00:00 2001 From: Daniel O'Connor Date: Sat, 26 Apr 2025 04:08:55 +0000 Subject: [PATCH 5/6] Add BC break docs --- CHANGELOG.md | 10 ++++++++-- src/themes/_theme.scss | 22 ++++++++++++++++++++++ 2 files changed, 30 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 22a0b8bc07..29dfb20248 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,8 +5,14 @@ ChangeLog #### Breaking changes in 1.25.x -- Remove `toolbarAlign` in favour of flexbox. To migrate, simply add CSS. IE if you previously specified left alignment, using Bootstrap; the same effect is possible via `.bs-bars { margin-right: auto }` - +- Remove `toolbarAlign` in favour of flexbox. To migrate, simply override CSS. IE if you previously specified right alignment, using Bootstrap: +``` +@media(min-width: "992px") { + .bs-bars { + margin-right: none; /** Instead of margin-right: auto */ + } +} +``` ### 1.24.1 #### Core diff --git a/src/themes/_theme.scss b/src/themes/_theme.scss index 1801d34883..ef8d1c9e9a 100644 --- a/src/themes/_theme.scss +++ b/src/themes/_theme.scss @@ -1,7 +1,29 @@ @use "variables"; +/** + * Same as Bootstrap 5's "Large" breakpoint. + * @todo Refactor if other frameworks have different breakpoints + * @todo Is it safe to use bootstrap 5 equivalents? + */ +@media(min-width: "992px") { + .fixed-table-toolbar { + align-items: flex-end; + } + .bs-bars { + margin-right: auto; + } +} + +@media(max-width: "991px") { + .fixed-table-toolbar { + flex-direction: column; + } +} + .bootstrap-table { .fixed-table-toolbar { + display: flex; + &::after { content: ""; display: block; From da3f902dc47e15c0f131c1ca4e1b673fe43c2334 Mon Sep 17 00:00:00 2001 From: Daniel O'Connor Date: Sat, 26 Apr 2025 04:23:56 +0000 Subject: [PATCH 6/6] Extract buttonRendering from main initToolbar() --- src/bootstrap-table.js | 89 ++++++++++++++++++++++-------------------- 1 file changed, 46 insertions(+), 43 deletions(-) diff --git a/src/bootstrap-table.js b/src/bootstrap-table.js index 0b95a258a9..e3f535e2ef 100644 --- a/src/bootstrap-table.js +++ b/src/bootstrap-table.js @@ -608,6 +608,51 @@ class BootstrapTable { this.initBody() } + renderButton (buttonName, buttonConfig) { + let buttonHtml + + if (buttonConfig.hasOwnProperty('html')) { + if (typeof buttonConfig.html === 'function') { + buttonHtml = buttonConfig.html() + } else if (typeof buttonConfig.html === 'string') { + buttonHtml = buttonConfig.html + } + } else { + let buttonClass = this.constants.buttonsClass + + if (buttonConfig.hasOwnProperty('attributes') && buttonConfig.attributes.class) { + buttonClass += ` ${buttonConfig.attributes.class}` + } + buttonHtml = `