CODEWITHSUNDEEP
jqueryevents
user1128748
user1128748

Reputation: 1

Jquery/JS No event handling on dynamically generated table

I have the following problem: I use an ajax query to retrieve customer info, the info returned populates a table. Only Last name, first name is displayed, plus a display:none field for customerID.

I need that, when user doubleclicks a row in this table, detailed info is retrieved about selected customer using customerID.

BUT: apparently jquery doesn't allow for event handling on the dynamically generated rows.

Jquery generating rows: (works): var tblRow ="tr class='2clicks'"+"td style='display:none'"+cust.Code_Client+"/td"+"td"+cust.FirstName+"/td"+"td"+cust.lastName+/td+td+cust.DOB+"/td"+"/tr" ; $(tblRow).appendTo("#inserthere");

Event handling via class: $(".2clicks").dblclick( function (){ alert("ok"); });

also tried with "on" after searching on stackoverflow, did not work:

$("#inserthere tr td").on("dblclick", function(event){ alert($(this).parent().children().filter(':first').text()) });

Any help appreciated, Thanks

Jquery Events

Upvotes: 0

Views: 172

Answers (2)

The Alpha
The Alpha

Reputation: 146191

If you are not using latest version of jquery then you can use

$(".2clicks").live('click', function(e){ 
    // code here 
});

If you are using the latest version then you can use

$('#inserthere').on('click', '.2clicks', function(e){
    // code here
});

Live is deprecated in newer version.

Upvotes: 1

elclanrs
elclanrs

Reputation: 94101

To delegate events with on() you need to call it on the parent static element which you're sure will be there on DOM ready and then pass it the dynamic children selector to delegate events on. 

$('#inserthere').on('dblclick', 'td', function (e) {
    // Something here
});

Upvotes: 0

Related Questions