Skip to content

MudDataGrid: Custom Child Row Rendering #11594

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

Jump to bottom
Open
wants to merge 4 commits into
base: dev
Choose a base branch
from
Open

MudDataGrid: Custom Child Row Rendering #11594

wants to merge 4 commits into from
+112 −6

Conversation

@csteeg
Copy link

@csteeg csteeg commented Jul 3, 2025 •
edited
Loading

I would like to have an option to control the childrow placeholder (so not just 1 td with colspan="1000")
I've had 2 situations where I needed this:

  1. real child rows (so exactly the same format, same columns, but as a child)
  2. colspan for some of the columns, so it's nicely outlined with the parent's row columns
  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Documentation (fix or improvement to the website or code docs): image

Checklist

  • The PR is submitted to the correct branch (dev).
  • My code follows the code style of this project.
  • I've added relevant tests.

Please let me know if you would want to incorporate this proposal, then I'll add the relevant tests and/or fix your comments

@github-actions github-actions bot added the enhancement Request for adding a new feature or enhancing existing functionality (not fixing a defect) label Jul 3, 2025
@sonarqubecloud
Copy link

sonarqubecloud bot commented Jul 3, 2025

Quality Gate Passed Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

@codecov
Copy link

codecov bot commented Jul 3, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 91.21%. Comparing base (994aa57) to head (413a461).
Report is 2 commits behind head on dev.

Additional details and impacted files 
@@           Coverage Diff           @@
##              dev   #11594   +/-   ##
=======================================
  Coverage   91.21%   91.21%           
=======================================
  Files         466      466           
  Lines       14699    14699           
  Branches     2855     2854    -1     
=======================================
  Hits        13407    13407           
  Misses        646      646           
  Partials      646      646

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@danielchalmers danielchalmers changed the title First proposal for custom childrow rendering MudDataGrid: Custom Child Row Rendering Jul 12, 2025
@danielchalmers danielchalmers requested a review from Copilot July 12, 2025 18:41
@danielchalmers
Copy link
Member

danielchalmers commented Jul 12, 2025

Want to be transparent that it might take a while to get an answer on moving it forwards

Copilot AI reviewed Jul 12, 2025
View reviewed changes
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull Request Overview

A new ChildRowRenderer parameter has been added to MudDataGrid to allow full control over child row rendering. The virtualized row component has been updated to invoke this renderer, and documentation/examples have been added to demonstrate the feature.

  • Introduce ChildRowRenderer parameter in MudDataGrid.razor.cs.
  • Update DataGridVirtualizeRow.razor to render either the custom renderer or the legacy content.
  • Add a new example and documentation section for row detail rendering.

Reviewed Changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.

File Description
src/MudBlazor/Components/DataGrid/MudDataGrid.razor.cs Added ChildRowRenderer parameter with XML docs
src/MudBlazor/Components/DataGrid/DataGridVirtualizeRow.razor Extended rendering logic to call ChildRowRenderer
src/MudBlazor.Docs/Pages/Components/DataGrid/Examples/DataGridDetailRowRendererExample.razor New example showcasing ChildRowRenderer usage
src/MudBlazor.Docs/Pages/Components/DataGrid/DataGridPage.razor Added documentation section for row detail renderer feature
Comments suppressed due to low confidence (2)

src/MudBlazor.Docs/Pages/Components/DataGrid/DataGridPage.razor:237

  • The Code parameter references DataGridDetailRowExample, but the example component is named DataGridDetailRowRendererExample. Update it to Code="@nameof(DataGridDetailRowRendererExample)" to ensure the correct code is displayed.
            <SectionContent DarkenBackground="true" Code="@nameof(DataGridDetailRowExample)" ShowCode="false" Block="true" FullWidth="true">

src/MudBlazor/Components/DataGrid/MudDataGrid.razor.cs:882

  • The new ChildRowRenderer parameter lacks unit or integration tests to verify correct rendering behavior. Consider adding tests to cover scenarios where a custom renderer is provided.
        public RenderFragment<CellContext<T>> ChildRowRenderer

versile2
versile2 suggested changes Oct 20, 2025
View reviewed changes
Copy link
Contributor

@versile2 versile2 left a comment

Choose a reason for hiding this comment

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

This has been requested a bunch of times. This will fit in nicely. Make the changes and let's get this submitted up.

csteeg and others added 3 commits October 21, 2025 09:49
@csteeg
Merge branch 'dev' into feature/custom-childrows
65601a0
@csteeg @versile2
Apply suggestion from @versile2
c98a814 
Co-authored-by: Versile Johnson II <148913404+versile2@users.noreply.github.com>
@csteeg @versile2
Update src/MudBlazor/Components/DataGrid/MudDataGrid.razor.cs
dec2cee 
Co-authored-by: Versile Johnson II <148913404+versile2@users.noreply.github.com>
versile2
versile2 approved these changes Oct 21, 2025
View reviewed changes
Copy link
Contributor

@versile2 versile2 left a comment

Choose a reason for hiding this comment

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

Can you post a screenshot of the Doc section you added in the initial PR request?

@csteeg
Copy link
Author

csteeg commented Oct 22, 2025

Can you post a screenshot of the Doc section you added in the initial PR request?

image

@versile2
Copy link
Contributor

versile2 commented Oct 23, 2025

Can you post a screenshot of the Doc section you added in the initial PR request?

image

I meant edit your initial PR post with "Checklist" etc so it's at the top/front easy to look at and refer to later.

@versile2 versile2 requested a review from ScarletKuro October 23, 2025 14:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

Copilot code review Copilot Copilot left review comments

@ScarletKuro ScarletKuro Awaiting requested review from ScarletKuro

+1 more reviewer

@versile2 versile2 versile2 approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

enhancement Request for adding a new feature or enhancing existing functionality (not fixing a defect)

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@csteeg @danielchalmers @versile2