Fixed columns with the same @bind-Field value cause a visual rendering issue in Table

[FrankAvendano]

Is there an existing issue for this?

• I have searched the existing issues

Describe the bug

I am using the Table component in a Blazor Server project with two fixed columns: one column that displays an auto-incremented value and another column that contains an action button area. The auto-increment column is positioned at the beginning of the table, while the button area column is positioned at the end. Both columns are configured as fixed columns, with additional columns displayed between them.

The issue occurs when both columns use the same @bind-Field value. When the same field is assigned to both columns, the table starts showing incorrect visual behavior: the auto-increment column is no longer displayed, but the space reserved for that column remains visible. Additionally, the button column, which was originally positioned at the end of the table, moves to the first position, completely changing the expected column order.

This behavior started occurring in version 10.7.3 of the component, installed through NuGet. The previous version, 10.6.0, did not have this issue and the table was rendered correctly.

Expected Behavior

The fixed columns should maintain their positions and render correctly. If using the same @bind-Field value for multiple columns is not supported, the component should validate this condition and provide a clear warning.

Interactive render mode

Interactive Server (Interactive server-side rendering (interactive SSR) using Blazor Server)

Steps To Reproduce

1. Create a table using the Table component.
2. Add a fixed column at the beginning that displays an auto-incremented value.
3. Add a fixed column at the end that contains action buttons.
4. Keep additional columns between both fixed columns.
5. Assign the same value to @bind-Field for both the auto-increment column and the button column.
6. Render the table using version 10.7.3.

Exceptions (if any)

No response

.NET Version

NET9.0

Anything else?

• Framework: Blazor Server
• Installation method: NuGet
• Affected version: 10.7.3
• Last working version: 10.6.0

[bb-auto[bot]]

@FrankAvendano Thank you for filing this issue. In order for us to investigate this issue, please provide a minimalistic repro project that illustrates the problem.

[Tony-ST0754]

The new version has been updated. Please refer to the following example. FieldName cannot be duplicate

<TableTemplateColumn FieldName="Max" Text="Max">
    <Template Context="v3">@v3.Row.Education</Template>
</TableTemplateColumn>
<TableTemplateColumn FieldName="Min" Text="Min">
    <Template Context="v3">@v3.Row.Count</Template>
</TableTemplateColumn>

[ArgoZhang]

@FrankAvendano Version 10.7.3 and later added column drag-and-drop sorting functionality. However, this feature does not work when multiple columns are bound to the same column. Therefore, the current constraint does not allow binding to the same column. If you require this functionality, please use TableTemplateColumn.