JQuery AJAX вызов не работает с веб-API? - PullRequest
Новая
       18

JQuery AJAX вызов не работает с веб-API?

0 голосов
/ 12 февраля 2019

У меня есть несколько записей на моей странице, и у каждой записи есть кнопка удаления, и когда я нажимаю на кнопку, ajax не вызывает API?

Я пытаюсь выяснить, куда я собираюсьсоздать ошибку.Если кто-то разобрался.дайте мне знать, пожалуйста.

Кнопка 

<button type="button" data-entryId="@entry.Id" class="btn-delete btn btn-danger CustomStyleForEditAndDeleteButton">
   Delete
</button>

API 

// Get : api/entries/1
[HttpDelete]
public IHttpActionResult DeleteEntry(int id)
{
   var entryInDb = _context.Entries.SingleOrDefault(x => x.Id == id);
   if (entryInDb == null)
      return NotFound();
      else
         _context.Entries.Remove(entryInDb);
      _context.SaveChanges();

      return Ok();
}

jQuery 

@section scripts{
    <script>
        $(document).ready(function () {
            jQuery(".btn-delete").click(function () {
                bootbox.confirm({
                    size: "small",
                    message: "Are you sure you want to delete this post?",
                    callback: function (result) {
                        if (result) {
                            jQuery.ajax({
                                url: "/api/entries/" + this.attr("data-entryId"),
                                method: "DELETE",
                                success: function () {
                                    bootbox.alert("The post is successfully deleted!");
                                },
                                error: function () {
                                    bootbox.alert("something goes wrong when attempting delete operation please try again.");
                                }
                            });
                        }
                    }
                });
            });
        });
    </script>
}

Спасибо.

1 Ответ

0 голосов
/ 12 февраля 2019

Проблема была с кнопкой jQuery.this.attr("//..")

Правильный код jQuery: 

            $(document).ready(function () {
            // #entriesDetails - Parent element of a button.
            jQuery("#entriesDetails").on("click", ".btn-delete", function () {

                var button = $(this);

                bootbox.confirm({
                    size: "small",
                    message: "Are you sure you want to delete this post?",
                    callback: function (result) {
                        if (result) {
                            jQuery.ajax({
                                url: "/api/entries/" + button.attr("data-entryId"),
                                method: "DELETE",
                                success: function () {
                                    bootbox.alert("The post is successfully deleted!");
                                    window.location.reload();
                                },
                                error: function () {
                                    bootbox.alert("something goes wrong when attempting delete operation please try again.");
                                    window.location.reload();
                                }
                            });
                        }
                    }
                });
            });

        });
...