This question already has an answer here:
I have two pages: edit.php
and list-questions.php
. I am wanting to load content from list-questions
to edit
, this works.
I also want to be able to trigger on('click')
from list-questions
within edit
.
Within Edit.php
I have:
<script>
$(document).ready(function() {
var questions = $('div.questions');
$('div.questions').load('list-questions.php?id=<?php echo $catID; ?>');
setInterval(function() {
$('div.questions').load('list-questions.php?id=<?php echo $catID; ?>');
}, 5000);
$('.trg-delete').on('click', function() {
console.log(true);
});
});
</script>
<div class="questions">
</div>
And within list-questions.php
I have:
<?php
$catID = $_GET['id'];
$getItems = $con->prepare("SELECT itemID,itemName,itemType FROM items WHERE catID=?");
$getItems->bind_param("i", $catID);
$getItems->execute();
$getItems->store_result();
if($getItems->num_rows > 0) {
?>
<table class="full outline">
<tr class="head">
<td colspan="2"><p>Questions</p></td>
</tr>
<?php
$getItems->bind_result($itemID,$itemName,$itemType);
while($getItems->fetch()) {
?>
<tr>
<td><p><?php echo $itemName; ?></p></td>
<td class="fixed-100 options">
<a class="trg-delete confirm" data-id="<?php echo $itemID; ?>"><i class="fa fa-fw fa-close"></i></a>
</td>
</tr>
<?php }; ?>
</table>
<?php } else { ?>
<table class="full outline">
<tr class="head">
<td colspan="2"><p>Questions</p></td>
</tr>
<tr>
<td colspan="2"><p class="alert">No Questions Found</p></td>
</tr>
</table>
<?php
};
When questions are found it outputs something similar to (simplified):
<div class="questions">
<table>
<tr>
<td><p>Questions</p></td>
</tr>
<tr>
<td><p>Question?</p></td>
<td>
<a class="trg-delete" data-id="1"><i></i></a>
</td>
</tr>
</table>
</div>
How would I go about listening for a click from .trg-delete
in edit.php
?
</div>