Hi , I have a button inside a div and when i clicked that button , ajax request is made and loading the response inside a div where my button is available . How the response text have the same button but it didn't call the ajax . EX: <div id="iamdiv"> <input type="text " name="name" > <input type="button" name="iambutton" /> </div> now -> for onclick event i used jquery to call the ajax ->and ajax response contain : <input type="text " name="name" > <input type="button" name="iambutton" /> and added it to the div using .html option in jquery ->But after the first ajax call it didnt trigger the onclick event function. Why so? How to overcome this. But this works fine when i use the simple ajax request and the onclick button attribute.
Events are not binded to your new AJAX loaded elements. To solve this problem you need to bind events to your newly loaded elements. Use an ajax callback function to bind events to loaded elements Example $.ajax( { url: "google.com", success: function(response) { $("#container").empty().append(response); $('#container .my-button').click(...); } }); Code (markup):
Please have a look at this example: http://demo.koolphp.net/Examples/KoolAjax/UpdatePanel/First_Look/index.php