Skip to content

fix(Table): double click col trigger ResizeColumnCallback #6809

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Sep 30, 2025
Merged

fix(Table): double click col trigger ResizeColumnCallback #6809

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
4b070b2
fix(Table): double click col trigger ResizeColumnCallback
ArgoZhang Sep 30, 2025
775aa86
chore: bump version 9.11.1-beta01
ArgoZhang Sep 30, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/BootstrapBlazor/BootstrapBlazor.csproj
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<Project Sdk="Microsoft.NET.Sdk.Razor">

<PropertyGroup>
<Version>9.11.0</Version>
<Version>9.11.1-beta01</Version>
</PropertyGroup>

<ItemGroup>
Expand Down
36 changes: 23 additions & 13 deletions src/BootstrapBlazor/Components/Table/Table.razor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -617,16 +617,7 @@ const setResizeListener = table => {
}
tableEl.setAttribute('style', `width: ${width}px;`)

if (table.options.showColumnWidthTooltip) {
const tip = bootstrap.Tooltip.getInstance(col);
if (tip && tip._isShown()) {
const inner = tip.tip.querySelector('.tooltip-inner');
const tipText = getColumnTooltipTitle(table.options, colWidth + marginX);
inner.innerHTML = tipText;
tip._config.title = tipText;
tip.update();
}
}
resetColumnWidthTips(table, col);

const header = col.parentElement;
if (header.classList.contains('fixed')) {
Expand Down Expand Up @@ -680,13 +671,26 @@ const resizeNextFixedColumnWidth = (col, width) => {
}
}

const resetColumnWidthTips = (table, col) => {
if (table.options.showColumnWidthTooltip) {
const tip = bootstrap.Tooltip.getInstance(col);
if (tip && tip._isShown()) {
const inner = tip.tip.querySelector('.tooltip-inner');
const tipText = getColumnTooltipTitle(table.options, col.closest('th'));
inner.innerHTML = tipText;
tip._config.title = tipText;
tip.update();
}
}
}

const setColumnResizingListen = (table, col) => {
if (table.options.showColumnWidthTooltip) {
EventHandler.on(col, 'mouseenter', e => {
closeAllTips(table.columns, e.target);
const th = col.closest('th');
const tip = bootstrap.Tooltip.getOrCreateInstance(e.target, {
title: getColumnTooltipTitle(table.options, th.offsetWidth),
title: getColumnTooltipTitle(table.options, th),
trigger: 'manual',
placement: 'top',
customClass: 'table-resizer-tips'
Expand All @@ -698,8 +702,8 @@ const setColumnResizingListen = (table, col) => {
}
}

const getColumnTooltipTitle = (options, width) => {
return `${options.columnWidthTooltipPrefix}${width}px`;
const getColumnTooltipTitle = (options, th) => {
return `${options.columnWidthTooltipPrefix}${th.offsetWidth}px`;
}

const indexOfCol = col => {
Expand Down Expand Up @@ -742,6 +746,12 @@ const autoFitColumnWidth = async (table, col) => {
});

setTableDefaultWidth(table);

if (table.options.resizeColumnCallback) {
await table.invoke.invokeMethodAsync(table.options.resizeColumnCallback, index, maxWidth)
Copy link

Copilot AI Sep 30, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Missing semicolon at the end of the statement. JavaScript statements should end with semicolons for consistency and to avoid potential issues with automatic semicolon insertion.

Suggested change
await table.invoke.invokeMethodAsync(table.options.resizeColumnCallback, index, maxWidth)
await table.invoke.invokeMethodAsync(table.options.resizeColumnCallback, index, maxWidth);

Copilot uses AI. Check for mistakes.

}
Comment on lines 748 to +752
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion (bug_risk): Consider error handling for async callback invocation.

Wrapping the async call in a try/catch block will help prevent unhandled promise rejections, particularly if the callback is user-defined.

Suggested change
setTableDefaultWidth(table);
if (table.options.resizeColumnCallback) {
await table.invoke.invokeMethodAsync(table.options.resizeColumnCallback, index, maxWidth)
}
setTableDefaultWidth(table);
if (table.options.resizeColumnCallback) {
try {
await table.invoke.invokeMethodAsync(table.options.resizeColumnCallback, index, maxWidth);
} catch (error) {
console.error("Error invoking resizeColumnCallback:", error);
}
}


resetColumnWidthTips(table, col);
}
}

Expand Down
Loading