I am totally new in php, so my opology if this question seems weird to you.
I have one php file (index.php) something like,
echo "
<div>
<FORM name='myform' id='myform' method='post' action=''>
// I fetch data from mysql and populate dropdown list. Tha't work fine.
// Then I have one submit button when I click on that
echo "<button id='showButton' type='submit'> Show </button>";
</FORM>
";
Then I have one process.js file something like,
$(document).ready(function() {
$('#showButton').click(function () {
// Here I make one AJAX call to php file (fetch_more_data.php), which fetch more data from database
// This also works fine
});
});
In fetch_more_data.php I fetch more data and display in table using
echo "
<script type = 'text/javascript' src = 'edit.js'></script>
<table ...>
<td>
<button id="myButton"></button>
</td>
</table>
";
This is also work fine. but I want to edit one table cell and for that I need to write some java script code. I want to write on click function for myButton in Javascripr, for that I have written on edit.js file,
$(document).ready(function() {
$('#myButton').click(function () {
alert('Hello');
});
});
The problem is $('#myButton').click(function ()
never called. I have spent long time but being a beginner my search options are limited. I would appriciate if someone solve this problem.
Regards,
try calling it like this:
$(document).ready(function(){
$(document).on('click', '#myButton', function(){
alert('hi');
});
});
hope this helped
try with
$('#myButton').live('click',function () {
alert('Hello');
});
});
Try this:
$(document).ready(function() {
$(document).on("click", "#myButton", function () {
alert('Hello');
});
});
Since the html is being added to the DOM dynamically, you need to handle it using Event Delegation in jQuery
I think the problem is that you are not loading the jQuery
Download the jquery on the same folder where is your php file and add this line in your code
<script src="jquery-1.11.0.min.js"></script>