Cleanest way to implement collapsable entries in a table generated via asp:Repeater?
https://stackoverflow.com/questions/77082
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianQuestion
Before anyone suggests scrapping the table tags altogether, I'm just modifying this part of a very large system, so it really wouldn't be wise for me to revise the table structure (the app is filled with similar tables).
This is a webapp in C# .NET - data comes in from a webservice and is displayed onscreen in a table. The table's rows are generated with asp:Repeaters, so that the rows alternate colers nicely. The table previously held one item of data per row. Now, essentially, the table has sub-headers... The first row is the date, the second row shows a line of data, and all the next rows are data rows until data of a new date comes in, in which case there will be another sub-header row.
At first I thought I could cheat a little and do this pretty easily to keep the current repeater structure- I just need to feed some cells the empty string so that no data appears in them. Now, however, we're considering one of those +/- collapsers next to each date, so that they can collapse all the data. My mind immediately went to hiding rows when a button is pressed... but I don't know how to hide rows from the code behind unless the row has a unique id, and I'm not sure if you can do that with repeaters.
I hope I've expressed the problem well. I'm sure I'll find a way TBH but I just saw this site on slashdot and thought I'd give it a whirl :)
Solution
When you build the row in the databinding event, you can add in a unique identifier using say the id of the data field or something else that you use to make it unique.
Then you could use a client side method to expand collapse if you want to fill it with data in the beginning, toggling the style.display setting in Javascript for the table row element.
OTHER TIPS
just wrap the contents of the item template in an asp:Panel, then you have you have a unique id. Then throw in some jquery for some spice ;)
edit: just noticed that you are using a table. put the id on the row. then toggle it.
