0

First i have a method that generates a HTML and fetches some information from the database

public function readNotes()
{

    $stmt = parent::connect()->prepare($this->getNotesQuery());
    $stmt->execute();

    if ($stmt->rowCount() == 0) {
        echo "<h2>No notes found! Start by adding one!</h2>";
    } else {
        while ($note = $stmt->fetch()) {
            echo "<div class='card' style='width: 18rem;'>
            <div class='card-body text-dark'>
                <h5 class='card-title'>{$note['note_title']}</h5>
                <p class='card-text'>{$note['note']}</p>
                <div class='col'>
                <button type='button' class='btn btn-danger bt' id = '{$note['id']}'>Delete</button>
                </div>
            </div>
        </div>";
        }
    }
}

Then into another PHP file i simply call that information with the following Ajax:

$(document).ready(function() {
    $.ajax({
        type: "GET",
        url: "./includes/read-note-inc.php",
        data: {
            id: $("#id").val(),
        },
        success: function(data) {
            $("#myNotes").html(data);
        }
    });
});

This works as it should, now as you can see in the readNotes() method i have a button with a class bt and id that corresponds with the matching id from the database. Then i have this jQuery code that doesn't seem to work and i don't know why:

$(document).ready(function() {
    $('.bt').click(function() {
        var id = $(this).attr('id');
        alert(id);
    });
});

Now you may ask if i have called jQuery before using, and i have, i also have on the same page used other jQuery code that works, but only this one seems to not work. Also i have no errors in the console whatsoever.

Phil
  • 157,677
  • 23
  • 242
  • 245
Raitiko
  • 165
  • 11
  • 1
    `$('.bt').on("click", (function() {.....................` ? – 4b0 Nov 29 '22 at 09:23
  • 1
    @4b0 that's exactly the same – Phil Nov 29 '22 at 09:27
  • 1
    TL;DR on the duplicate... use `$(document).on("click", ".bt", function() { ... })` – Phil Nov 29 '22 at 09:31
  • It did worked and will look more into this. The thing was that i used $("#addNote").click(function() {...} before this one and it didn't seem to have a problem. This was my problem. Nonetheless your answer worked. – Raitiko Nov 29 '22 at 09:36

0 Answers0