Ah... but then it's no longer tabular because it exists across multiple tables, therefore the whole reason for using a table is lost. I'm not saying I'm an expert (or an accessibility/standards guru), but it's my understanding that tables should be used only for data which has both an x and y associations. Anyone care to correct me, am I being to strict?
- jake On 3/28/07, Andy Matthews <[EMAIL PROTECTED]> wrote:
Ahhhh $(this),parent()!!! I tried this.parent() and $this.parent() to no avail. Thanks for your feedback on the TR...I know I can use divs, but this is tabular data. So maybe I'll just have to use rows of DIVs, each containing a table. ------------------------------ *From:* [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] *On Behalf Of *Jake McGraw *Sent:* Wednesday, March 28, 2007 1:37 PM *To:* jQuery Discussion *Subject:* Re: [jQuery] Table of information,expanding one row using AJAX call and callback function. First, you can not animate table rows (tr) because almost all of the motion animations are written for block level elements. You could, however, place the information within a couple of divs and position them to get the look and feel you currently have with tables. This will allow you to use most of the Interface animations and prevent you from committing misuse of a table. Second, if you were wanted to grab the ID of the TR element upon clicking the IMG element in the following code: <tr id="foo"><td><img src="bar.gif"/></td></tr> You would need the following code (I prefer using the higher level click(), hover(), etc functions as opposed to bind()): $("img").click(function(){ $(this).parent().parent().attr("id"); }); As the TR element is the parent of the parent of the IMG. Finally, there are a lot of examples throughout the mailing list of how to add dynamic "load on click" functionality, a good place to start is http://docs.jquery.com/Ajax. - jake On 3/28/07, Andy Matthews < [EMAIL PROTECTED]> wrote: > > I'm working on project which will have a table of information. For any > row, there could be more "more information" that the user may want to view. > Any row with more information would have some sort of image indicating this. > When the user clicks the row, I'd like to pull data using AJAX, then expand > the row via a callback function. > > Here's how I might do it, does anyone have a better solution? > > <table border="1" width="400"> > <tr id="methodname|123456" class="row"> > <td>Name</td> > <td>Address</td> > <td><img src="moreinfo.gif" name="image1" /></td> > </tr> > <tr id="row1details" style="display: none;"> > <td colspan="3"> > additional details would go here<br /> > additional details would go here<br /> > additional details would go here<br /> > additional details would go here<br /> > additional details would go here<br /> > </td> > </tr> > </table> > > > $(document).ready( function(){ > > $('.row td img').bind("click", function() { > $('#row1details').slideDown("slow"); > }); > > }); > > The first problem with this is that the TR doesn't animate. It merely > shows, even though I'm using slideDown. What am I doing wrong there? > > I'm not even sure how to do the AJAX call. For any row which has more > information, I need to pass in two values...a string representing a > Coldfusion method to call, and a number representing the id of the record I > want to return to the page. I think the easiest way to do this would be to > stash the methodname and number (id) as the id of the row, then parse that > in the click function. I think I can figure out that part. > > Another question I have is in the above example, when I click the img, I > need to be able to get the ID of it's parent TR. I thought that this would > work: > > $('.row td img').bind("click", function() { > this.parent('tr').attr('id'); > }); > > But it returns an error saying "Object doesn't support this property or > method.". What am I doing wrong? > > Please feel free to answer any one of these questions... > > * ____________________________________ > > Andy Matthews > *Senior Coldfusion Developer > > Office: 877.707.5467 x747 > Direct: 615.627.9747 > Fax: 615.467.6249 > [EMAIL PROTECTED] > www.dealerskins.com > > > _______________________________________________ > jQuery mailing list > discuss@jquery.com > http://jquery.com/discuss/ > > > _______________________________________________ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
_______________________________________________ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
