Функция не определена, когда HTML загружается с другой страницы с помощью AJAX

Question

У меня есть таблица на одной странице, и я выбираю строки базы данных с помощью ajax, у меня есть кнопка, и он нажимает, он выполняет функцию с именем deleteRow (), но когда я нажимаю, говорит, что deleteRow () не определен.

Страница, на которой я хочу показать таблицу:

<table>
    <thead>
        <td>Id</td>
        <td>Nome</td>
        <td>email</td>
        <td>numero</td>
        <td>data</td>
        <td>hora</td>
    </thead>
    <tbody>
    </tbody>
</table>
<script>
    $(document).ready(function(){
        update();
        setInterval(function(){update()}, 10000);
        function update(){
            $.ajax({
                type: 'post',
                url: 'getReservas.php',
                success: function (response) {
                    $("table").children("tbody").html(response);
                }
            });
        }
        function deleteRow(elem){
            console.log("oi");
            var isto = elem;
            var id = isto.attr("id");
            $.ajax({
                type: "POST",
                url: "deleteReserva.php",
                data: id,
                success: function(data){
                    isto.remove();
                }
            });
        }
    });
</script>

getReservas.php

<?php
    include "conexaoBaseDados.php";
    $query = $mysqli->query("SELECT * FROM reservas");
    $dados = array();
    if($query->num_rows > 0){
        while($row = $query->fetch_assoc()){
            $dados[] = $row;
        }
        foreach($dados as $r){
            echo "<tr>";
            echo "<td onclick='deleteRow(this);' id=". $r["id"] .">" . $r['id'] . "</td>";
            echo "<td>" . $r['nomeCliente'] . "</td>";
            echo "<td>" . $r['emailCliente'] . "</td>";
            echo "<td>" . $r['numeroCliente'] . "</td>";
            echo "<td>" . $r['dataReserva'] . "</td>";
            echo "<td>" . $r['horaReserva'] . "</td>";
            echo "</tr>";
        }
    }
?>

Answer 1

Функция deleteRow() определена внутри обратного вызова ready, поэтому она существует только внутри области этого обратного вызова.

Вам необходимо переместить код функции deleteRow во внешнюю область.

Например -

<script>

    function deleteRow(elem){
        console.log("oi");
        var isto = elem;
        var id = isto.attr("id");
        $.ajax({
            type: "POST",
            url: "deleteReserva.php",
            data: id,
            success: function(data){
                isto.remove();
            }
        });
    }

    $(document).ready(function(){
        update();
        setInterval(function(){update()}, 10000);
        function update(){
            $.ajax({
                type: 'post',
                url: 'getReservas.php',
                success: function (response) {
                    $("table").children("tbody").html(response);
                }
            });
        }
    });
</script>