jquery - Ajaxで追加した要素（クライアントとサーバーの両方から）を削除します-MVC3

Question

データベースからテーブルにいくつかの要素を追加するビューがあります。テーブルをStudentsと呼びましょう。ビューでは、テーブルにいくつかの本を追加している生徒に割り当てるオプションもあります。私はAjaxでこれを行いました。

デモ：

    Name of Student: ...
    Books : <here is a drop down> ( from database)    < here is a button> (add button)

    <ul>
   When I click the button here I append some books. I also retain on Session the id of every book ( in a list and when I click submit I send that list to the server )
    </ul>
[Submit button]

問題は、次のように削除ボタンを追加したいということです。

    Name of Student: ...

    Books : <here is a drop down>     < here is a button> 

    <ul>
    Book1  delete
    Book2  delete
    </ul>
[Submit button]

そして、削除ボタンをクリックして、その要素をリストとセッションから削除します。

これが私のコードです：

• ビューからのスクリプト

  $(function () {
  
      $("#add").click(function () {
  
          //items.push($("#category").val());
          $.ajax({
              url: '@Url.Action("AddCategory")',
              type: "POST",
              dataType: "JSON",
              data: { id: $("#categoryId option:selected").val() },
              beforeSend: function () { },
              success: function (data) {
  
                  $("#toFill").append("<li>" + $("#categoryId option:selected").text() + " " + "<span style='cursor:pointer;' id='a'>" + "[X]" + "</span>" + " " + "</li>");
              },
              error: function () { alert("error") }
  
          })
          $("#toFill #a").click(function () {
  
              $.ajax({
                  url: '@Url.Action("DeleteCat")',
                  type: "POST",
                  dataType: "JSON",
                  data: { id: $("#categoryId option:selected").val() },
                  beforeSend: function () { },
                  succes: function (data) {
                      // $("li").remove();
                      alert("lala"); return false;
                  },
                  error: function () { alert("error at delete") }
  
  
  
              })
  
          });
      })
  

• AddCategoryおよびDeleteCatコントローラーから：

  public ActionResult AddCategory(int id)
  {
      Session.Category.Add(id);
      return Json(id, JsonRequestBehavior.AllowGet);
  }
  
  public ActionResult DeleteCat(int id)
  {
      Session.Category.Remove(id);
      return Json(id, JsonRequestBehavior.AllowGet);
  }
  

Answer 1

ドロップダウンに直接作用する削除ボタンが1つある場合、つまり、ドロップダウンでアイテムを選択し、[削除]をクリックして選択したアイテムを削除すると、より論理的で、追跡、使用、およびプログラミングが容易になります。