{"id":1213,"date":"2015-02-10T12:54:46","date_gmt":"2015-02-10T12:54:46","guid":{"rendered":"http:\/\/www.nikola-breznjak.com\/blog\/?p=1213"},"modified":"2015-08-10T06:53:33","modified_gmt":"2015-08-10T06:53:33","slug":"when-i-click-the-next-page-in-datatables-my-jquery-selectors-arent-working-anymore","status":"publish","type":"post","link":"https:\/\/nikola-breznjak.com\/blog\/stack-overflow\/when-i-click-the-next-page-in-datatables-my-jquery-selectors-arent-working-anymore\/","title":{"rendered":"When I click the next page in datatables my jquery selectors aren’t working anymore"},"content":{"rendered":"

\"profile<\/a>
\nI’m a big fan of Stack Overflow<\/a> and I tend to contribute regularly (am currently in the top 0.X%<\/a>).\u00a0In this category (stackoverflow<\/a>)\u00a0of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here<\/a>.<\/p>\n

My question<\/a> was:<\/p>\n

I’m using\u00a0datatables<\/a>\u00a0plugin for jquery to show my data on the page. I have this selector when someone clicks on a row:<\/p>\n

$('#myTable tr[class !=\"tableHeader\"]').click(function(){\r\n    alert(\"clicked!\");\r\n}<\/pre>\n
and everything is OK until I click on the “Next page” which shows me next 10 results – then this click function doesn’t show “clicked” message box anymore no matter which row I click.<\/p>\n
I’m guessing that the problem is in a way how these new results (rows in the table) are shown, so please give me some ideas on how to solve this.<\/p>\n
\u00a0The answer, by ghayes<\/a>,\u00a0was:<\/p>\n
\n
Use jQuery’s\u00a0Live function<\/a>.<\/strong>\u00a0Live will apply to all elements on the page, even ones that don’t exist yet (I assume this is your issue). Thus, your new rows will be clickable when they are created and added to the DOM.<\/p>\n
$('#myTable tr[class !=\"tableHeader\"]').live('click',function(){\r\n  alert(\"clicked!\");\r\n});<\/pre>\n<\/blockquote>\n","protected":false},"excerpt":{"rendered":"
I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%).\u00a0In this category (stackoverflow)\u00a0of posts I will will be posting…<\/p>\n","protected":false},"author":1,"featured_media":609,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[35],"tags":[],"class_list":["post-1213","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-stack-overflow"],"_links":{"self":[{"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/posts\/1213","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/comments?post=1213"}],"version-history":[{"count":2,"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/posts\/1213\/revisions"}],"predecessor-version":[{"id":1692,"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/posts\/1213\/revisions\/1692"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/media\/609"}],"wp:attachment":[{"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/media?parent=1213"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/categories?post=1213"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nikola-breznjak.com\/blog\/wp-json\/wp\/v2\/tags?post=1213"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}