How about:
// check for a sibling to this
var sibling = $(this).next('tr');
// if that sibling has the right class, use it
if (sibling.is('.description')){
sibling.load(...).toggle();
}else{
// create the new row and fill it (don't toggle--that would only hide it
$("<tr><td colspan='4'
class='description'></td></tr>").insertAfter(this).load(...);
}
bdee wrote:
>
> yea i dont want to create a new row every time it is clicked. i guss what
> i want to do is to create a details row when the first row is clicked -
> but only if the details row hasnt already been created. if its already
> been created then i want to remove it.
>
> the reason i dotn want to add the empty rown when the table loads and then
> hide it is that it adds to the initial load time of th page. and all the
> empty rows aren't hidden until the page is completely loaded so it looks
> messy until the hide function kicks in to hide the detail rows.
>
> i m really not sure how to proceed with this.
>
>
> Danny Wachsstock wrote:
>>
>> Try creating the element then using chaining to manipulate it:
>>
>> $("<tr><td colspan='4'
>> class='description'></td></tr>").insertAfter(this).load(...).toggle();
>>
>> But are you sure this is what you want? You'll end up creating a new row
>> each time it's clicked, not toggling
>> the old row. Why not create the (empty) description line when the table
>> is created, then hiding it:
>>
>> $('.description').hide();
>>
>> Then next() will do what you want:
>>
>> $(this).next('.description').load(...).toggle();
>>
>> Danny
>>
>>
>> bdee wrote:
>>>
>>>
>>> and up above in the head of my document i have the following:
>>> //show/hide description row on click
>>> $("tr.listing").click(function(){
>>> var myID = $(this).attr("id");
>>> $(this).after("<tr><td colspan='4'
>>> class='description'></td></tr>");
>>>
>>> $(this).next(".description").load("movieDetailsAjax.asp?movie="+myID);
>>> $(this).next(".description").toggle();
>>> });
>>>
>>> so the idea is that whenever you click a row with a class of "listing"
>>> the following will happen:
>>> set a variable congaing the movie id number
>>> after the current row, insert a row with one cell spanning all 4 columns
>>> then starting with the current row, find the next row with a class of
>>> "description" (the row we just created) and load the content from the
>>> ajax file (the html for the movie description and the thumbnail image)
>>> then starting with the current row, find the next row with a class of
>>> "description" (the row we just created) and toggle it. that way when
>>> you click on the row again, it will close this cell.
>>>
>>>
>>
>>
>
>
--
View this message in context:
http://www.nabble.com/onclick---toggle-the-creation-of-a-TR--tf3230589.html#a8996084
Sent from the JQuery mailing list archive at Nabble.com.
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
