Ajaxページ削除機能

4755 ワード

現在、サイドプロジェクトにおけるCRUD機能を実装しています.
このうち、DELETE機能を実現するため、フロントにAJAX機能を追加しました.
    <script>
      $('#delete').click((e) => {
        $.ajax({
          url:"/delete/",
          method: "DELETE",
          data: {cnt: e.target.value}
        }).done((result) => {
          location.reload();
        })
      })
    </script>

上図に示すように、複数のカードがページに記入され、deleteというボタンがたくさんあるので、赤いボックスカードのボタンを1枚しか操作できません.これに対して解決が必要だ.
<span class="delete" ><button type="button" class="btn btn-danger" value="<%= posts[i].cnt %>">삭제</button></span>


        $('.delete').click((e) => {
          $.ajax({
            url:"/delete/",
            method: "DELETE",
            data: {cnt: e.target.value}
          }).done((result) => {
            location.reload()
          }).fail((err) => {
            console.log("err", err);
          })
        })
コレクタのidは、単一のオブジェクトのみを指定します.
したがって、idを使用して特定のオブジェクトを選択することはできないため、最初の投稿のみが削除されます.
いくつかの簡便な方法を用いて,ボタン素子にspanラベルを付けて指定し,成功した.