Andy,
Just to clarify - $(this) will create a jQuery object from variable 'this',
which extends it with all of the fantastic jQuery methods and properties we
know and love.
'this' on its own is the DOM object and as such only has access to DOM
properties and methods.
Also, regarding the actual question and your last reply - my gut instinct
would say that if you can, avoid degrading your HTML just to get some JS
working. If you're using tabular data then you 'should' be using a table
with <tr>s and <td>s used properly. However I haven't tried to do what
you're doing and can't offer an alternative without trying it...
Rob
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] 71 <[EMAIL PROTECTED]>[mailto:
[EMAIL PROTECTED] 72 <[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 73 <http://docs.jquery.com/Ajax>.
- jake
On 3/28/07, Andy Matthews < [EMAIL PROTECTED]<[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] 75 <[EMAIL PROTECTED]>
> www.dealerskins.com 76 <http://www.dealerskins.com/>
>
>
> _______________________________________________
> jQuery mailing list
> discuss@jquery.com 77 <discuss@jquery.com>
> http://jquery.com/discuss/ 78 <http://jquery.com/discuss/>
>
>
>
_______________________________________________
jQuery mailing list
discuss@jquery.com 79 <discuss@jquery.com>
http://jquery.com/discuss/ 80 <http://jquery.com/discuss/>
--
Rob Desbois
Eml: [EMAIL PROTECTED]
Tel: 01452 760631
Mob: 07946 705987
"There's a whale there's a whale there's a whale fish" he cried, and the
whale was in full view.
...Then ooh welcome. Ahhh. Ooh mug welcome.
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
