Show Hide Details issue with .live()

lucasnp

Allan,

Wonderful tool you created.

However, I ran into this situation. I have a page which call other pages via ajax to display their contents inside the main page. One of the 'client' page contain a datatable.

So when I use .live('click',function() ....) and then switching between 'client' pages in the main page, it keep adding the 'click' event to the element (if i visit the datatables part twice from the main page, it open and close the row at once, if i visit three times, it open/close/open).

I wonder if there's a difference if I use
$('#table_email tbody tr').bind('click', function ()....);
instead of
$('#table_email tbody tr').live('click', function ()
?

My table is not static, I dont need to add/delete any row. So i think use .click will produce the same result. But in IE6, it mess up the cell position when i revisit the datatable part.

I'm sorry if Im being confusing but Im trying my best to explain. please let me know if you can help or need further explaination

Thank you

allan

> I wonder if there's a difference if I use
> $('#table_email tbody tr').bind('click', function ()....);
> instead of
> $('#table_email tbody tr').live('click', function ()

Yes there is - $().bind('click', ...) is the 'full' way of saying $().click(...) - it is not 'live'. The jQuery documentation will have more.

You should only need one call to the live event constructor - like this: http://datatables.net/release-datatables/examples/advanced_init/events_live.html

Allan

lucasnp

Allan,

thanks for your response. However, the issue is that I cannot use .click without mess up the table in IE6.

Here the screenshot when i visit the table the first time:
http://i67.photobucket.com/albums/h305/lucasnp/Misc/datatable_ie_1.jpg

and let say i go to the 'detail' tab and go back to the table
http://i67.photobucket.com/albums/h305/lucasnp/Misc/datatable_ie_2.jpg

If I use .live(), it keeps adding the 'click' event to the row.

I hope this explain my issue and you can help me :(.

allan

It looks like it is adding TD elements to the table. Can you should use the code that you are using - I presume you are running some code when the tab is 'activated'? You should only need to run that the first time the tab is activated.

Allan

lucasnp

Allan, thank you for your response. always a nice man :)>-

However, I should make myself clearer :(

The reason i dont use .live('click') is when I switching between the menu on top, the content below is called using ajax and if i visit the table twice, it added 1 more click event to the row. and going :(

I knew this is kinda stupid but I did kinda get around (not sure if it really fix it) but I remove the part where you add the to the header row. instead, i manually add 1 "" to the header row :( and then I can use the .click without messing up the table structure.

Still, Im hoping you have a better solution :(

Thank you Allan, always the best :)>-

allan

So when you say that the click event is added again, I presume that this is being done in an "activation" handler for the function? i.e. when the tab is clicked on, the handler is run initialising the table etc - is that correct? If that is the case, I would say that you want to change that bit of code so that it is only run on the first activation of the table - not every time.

Allan

lucasnp

yes sir. the .live is under $(document).ready of the 'client' page.

And my stupid question is how can i force it to run on the first activation only? :|

allan

That would depend on the tabs that you are using - I'd refer to the API documentation for them. To be certain that is what is happening you could stick an "alert" just before you call $().live(). For example: alert('Adding live events');

Allan

lucasnp

ok, the options on navigation bar replace a below with the content of the 'client' page.

I took your advice and it appears that every time i replace the with the datatable, it add 1 more 'click' event to the row.

for now, i just remove the lines where you add the extra th to the header row, and manually add one to the table. :(