Hi!
Is it possible to add interactive capabilities into a Data Grid column header? For example, the header title is a link that can be toggled to sort the data either ascending or descending by that particular column, or adding a “toggle all checkboxes” checkbox into the column header?
Here’s a screenshot illustrating what I mean:
I’ve tried to do this using both in the Anvil IDE and programmatically, but I can’t seem to find a way to make the header columns interactive. I have to place this functionality outside of the data grid as a separate component (like a link or button), but this makes the UI far less attractive.
I used @alcampopiano’s sample code and modified it a bit here, but can’t get the components to go into the column header:
https://anvil.works/build#clone:DP3CB3LCE54AHPB4=3OPCN3NEWL3LEO7N5AJYYUL3
Yes, use a DataRow Panel component and add components as you wish. Turn off “column headers” on the DataGrid though.
Thanks for responding so quickly!
I tried using the DataRow Panel component with the “column headers” off.
Is this how you would do it?
At first appearance, it seems to line up ok… (although the checkbox toggle isn’t quite perfect)
But when I resize the browser, the DataRow “headers” don’t stay with the Repeating Panel like a Data Grid would.
Do you know if there’s a way to connect the components so that it acts like the column header? Or did I not do this right?
Ahhh, thanks for the example!
Where I went wrong is I DELETED the DataGrid and REPLACED it with the DataRow panel. Your example shows to put the DataRow panel (and repeating panel) INTO the DataGrid.
This is what I’m looking for. Thank you for the help! 
3 Likes
