CODEWITHSUNDEEP
javascriptjquery
user1765862
user1765862

Reputation: 14145

dynamically added element is not wired on jquery event

on dom ready I have wired event 

$('.someClass').on('input', function (e) {
   //  do something
});

on same I'm injecting html elements with where I add .someClass to include that field for same event

var cssClass = "form-control";
if (myProperty == true) {
     cssClass = "form-control someClass";
}
('#myTable tr:last').after(
   '<tr>'+
   '<td><input class=' + cssClass + ' type="text"'</td></tr>'+
   '</tr>'
);

but I'm getting rendered inside firebug as 

<input class="form-control someClass" type="text"</td someClass="">

and this field is not fetched on .someClass event

Upvotes: 0

Views: 45

Answers (2)

MoLow
MoLow

Reputation: 3084

the solution is to write:

$('body').on('input','.someClass', function (e) {
   //  do something
});

and fix your code:

$('#myTable tr:last').after(
   '<tr>'+
   '<td><input class=' + cssClass + ' type="text"/></td></tr>'
);

Upvotes: 1

Martin Rifon
Martin Rifon

Reputation: 36

Mmm... aren't you missing the quotation mark (") in the input's class?

Furthermore, you are not correctly appending the td and tr closing tags. Try something like this:

$('#myTable tr:last').after(
    '<tr>' +
    '<td><input class="' + cssClass + '" type="text" /></td>' + 
    '</tr>'
);

Upvotes: 0

Related Questions