Вызов метода в index.cs html PageModel в javascript в Asp .NetCore

Question

Мне нужно вызвать метод удаления в моем index.cs html .cs из javascript. Причина в том, что я хочу использовать модальное или приятное подтверждение перед удалением. Используя мой текущий код, я могу получить «Id» записи, которую хочу удалить, но я застрял в том, как вызвать мой метод удаления в index.cs html .cs и передать ему идентификатор. Я не люблю использовать контроллер API. Пожалуйста, посмотрите мой код ниже

index.cs html

<td>
                                <button
                                        data-id="@item.Id"
                                        data-body-message="Are you sure?"
                                        class="btn btn-danger btn-sm delete">
                                    Delete
                                </button>
                                <a asp-page="Upsert" asp-route-id="@item.Id" class="btn btn-success btn-sm text-white">Edit</a>
                            </td>
                        </tr>

index.cs html .cs

public async Task<IActionResult> OnPostDeleteAsync(int id)
        {
            var customer = await context.Customers.FirstOrDefaultAsync(x => x.Id == id);
            if (customer == null)
            {
                return NotFound();
            }
            context.Customers.Remove(customer);
            await context.SaveChangesAsync();

            return RedirectToPage("Index");
        }

клиент. js

$((function () {
    var url;
    var redirectUrl;
    var target;
    var id;

    $('body').append(`
                    <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="myModalLabel">Warning</h4>
                        </div>
                        <div class="modal-body delete-modal-body">
                            
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal" id="cancel-delete">Cancel</button>
                            <button type="button" class="btn btn-danger" id="confirm-delete">Delete</button>
                        </div>
                        </div>
                    </div>
                    </div>`);

    //Delete Action
    $(".delete").on('click', (e) => {
        e.preventDefault();
        target = e.target;
        var Id = $(target).data('id');
        id = Id;
        var bodyMessage = $(target).data('body-message');

        $(".delete-modal-body").text(bodyMessage);
        $("#deleteModal").modal('show');
    });

    $("#confirm-delete").on('click', () => {
        debugger;
        $.ajax({
            type: 'POST',
            url: '?handler=Delete()',
            success: function (data) {
                alert(data);
            },
            error: function (error) {
                alert("Error: " + error);
            }
        })
    });

}()));

Я новичок в ASP. net Core MVC. Мне нужна ваша помощь. Спасибо.