使用swal删除对sql的操作

There's a form on one of my pages for which also I'm using Swal to ask the user to confirm his action (deleting a file) before making it happen. Here's the Swal code:

<script>
    function apagar(id) {
        
        swal({
            title: "Atenção",
            text: "Deseja eliminar o pedido com o id : " + id + " ?",
            type: "warning",
            showCancelButton: true,
            CancelButtonColor: "#d33",
            confirmButtonColor: "#d33",
            confirmButtonText: "Eliminar",
            cancelButtonText: "Cancelar",
            closeOnConfirm: false
        }, function () {
            swal("Pedido " + id + " eliminado com sucesso.", "Continuação de um bom trabalho.",
                "success");
            $.ajax({
                type: "POST",
                url: 'apagar.eventos.php',
                data: {
                    id: id

                },
                success: function (html) {
                     
                    window.location.href = 'index.php';
                }
            });
        });
        return false;
    }
</script>

And this is my submit button:

<button type="button"  id="<?php echo $idpedido;?>" onclick="apagar(this.id)" class="btn btn-warning">Cancelar Agendamento</button>

And this is my delete code:

<?php
include("db.connect.php");
$id2 = $_POST['id'];
$sql = "DELETE FROM nagenda WHERE id = '$id2' ";
$stmt = sqlsrv_query( $conn, $sql );
sqlsrv_close($conn);
?>

if you notice any hilarious mistake here, pardon my noobieness <

tried out all the suggestions that I found, like using the isConfirm function suggested by many users. But none worked.

EDIT

so i try on test files to see if i got error, so here is the code used on main file :

<div id="mydiv" class="container col-md-5">
<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<?php $idpedido="1145";?>

<button type="button" id="<?php echo  $idpedido;?>" onclick="apagar(this.id)" class="btn btn-warning">Cancelar Agendamento</button>

<script>
    function apagar(id) {
        
        swal({
            title: "Atenção",
            text: "delete id : " + id + " ?",
            type: "warning",
            showCancelButton: true,
            CancelButtonColor: "#d33",
            confirmButtonColor: "#d33",
            confirmButtonText: "yes",
            cancelButtonText: "no",
            closeOnConfirm: false
        }, function () {
            swal("id " + id + " have been deleted.",
                "success");
                $.ajax({
                type: "POST",
                url: 'teste2.php',
                data: {
                    id: id

                },
                success: function (html) {
                    include("teste2.php");
                }
            });
        });
        return false;
    }
</script>
<script src="vendors/bower_components/sweetalert/dist/sweetalert.min.js"></script>

code used to conect tu bd sql:

<?php
$id2 = $_POST['id'];

include("agenda\dist\db.connect.php");
 
$sql = "DELETE FROM nagenda WHERE id = '$id2' ";
$stmt = sqlsrv_query( $conn, $sql );
sqlsrv_close($conn);
?>

i'm geting error log :

Uncaught ReferenceError: $ is not defined
at Object.doneFunction (texte.php:23)
at l (sweetalert.min.js:1)
at Object.s [as handleButton] (sweetalert.min.js:1)
at HTMLButtonElement.g (sweetalert.min.js:1)

</div>

well i set the button id to "B1" then i added the code:

var clientId = document.getElementById('b1');

    clientId.onclick = function () {

        alertMessage(clientId.value);

    }

    function alertMessage(clientID) {
        swal({
            title: "Deseja eliminar o Agendamento?",
            text: "Se eliminar o agendamento não será possivel recuperar.",
            type: "warning",
            showCancelButton: true,
            confirmButtonColor: "#f8b32d",
            confirmButtonText: "Eliminar",
            cancelButtonText: "Cancelar",
            closeOnConfirm: false
        }, function () {
            swal("Agendamento liminado com sucesso.","success");
            sendAjax(clientID);
        });

        function sendAjax(clientID) {

            $.ajax({
                type: "POST",
                url: "dist/apagar.eventos.php",
                data: {
                    id: clientID
                },
                success: function (data) {
                    console.log(data)
                    window.location.reload()
                },
            });

        }

    }

looks like before i wasant indentified the button action..., worket for me

</div>