How to create div around table rows

[Rock Villa]

I have been using the ASP.NET AJAX UpdatePanel control a lot lately for some intranet apps I've been working on, and for the most part, I’m trying to apply a style to the text of several rows of a table. I only want to apply the style to some of the rows not all. I have been using it to dynamically refresh data or hide and show controls on a form based on the user's actions. I would like to hide or show a group of rows in a table. I tried wrapping those rows with a div, then I tried a span. Neither worked.

[Mecurtis]

Table rows are really tricky. You shouldn't wrap a div around rows, because it isn't valid. The one element that is intended for this is tbody. Multiple tbody tags are perfectly fine, too. why not just <table id="divTable" ...> you don't need to put extra div element here.

<div style="display: block" id="divRow">

First, you can try to style up with fixed height and overflow the <tbody> using <thead> for the table header.

[Timothi]

Use 'table-row-group' instead of 'table-row' & you can hide/show multiple rows at a time without creating a million document.getElementById() calls. Is there however anything else that would allow me to 'grab' a hold of all the 'encapsulated' objects (as they are by div) and deal with them from that (higher) level.

[DllD]

If you are dynamically creating your controls, you can decide which things to display or hide while generating your controls. If the columns of the two tables aren't aligned, you can always force via css the cells of the header of the containing table and the cells of the content table to have same width. $('table#yourid tr').slice(3,7).css('display', 'none');

HTML becomes invalid if you use div or span between table rows. UpdatePanels (or AJAX postbacks in general) should not be used to just hide or show elements.