").html('')); This ...">

Dynamically generated text field key press event

tr.append($("<td/>").html('<input type="text" name="unit_price" id="unit_price"/>'));

This is my dynamically generated text box. I tried many solutions as shown below, but its work does not help me geeks.

$("#unit_price").live("keyup", function(){  
     //Your Code to handle the click.
    }); 

$(staticAncestors).on(eventName, dynamicChild, function() {});
+4
source share
3 answers

Try it.

<table >
    <tr>
        <td class="test"></td>  

    </tr>
</table>

$(document).ready(function(){

$(".test").append($("<td/>").html('<input type="text" name="unit_price" id="unit_price"/>'));
     $("#unit_price").keyup(function(){
alert($(this).val());
  });
});

Demo: http://jsfiddle.net/cz1dvzvf/1/

+1
source

You need to use event delegation .

Event delegation allows us to attach one event listener to the parent element, which will fire for all descendants matching the selector, regardless of whether these descendants exist or are added in the future.

$("body").on("keyup","#unit_price", function(){  
 //Your Code to handle the click.
}); 
+2

$(document).on("keyup","#unit_price", function(){  
 //Results here
}); 
0