Question

这是我正在使用的html代码，你将在下面看到我引用的ID是来自此ID的SectionList，我们通过下面的ajax post get函数填充。然后ajax从mvc调用getsections部分，然后在前端填充它，它在保存和删除时执行此操作。这里的问题是我可以在列表中添加新记录，我也可以删除列表中的这些记录，但是当它出现在我列表中的最后一条记录时，它拒绝更新最后一条记录所附的ul。

＆＃13;

$(document).ready(function() {
  getSections();
});

function getSections() {
  $.ajax({
    url: '@Url.Action("getSections")',
    type: 'Get',
    datatype: 'json',
    success: function(data) {
      var total = data.length
      if (total = 0) {
        $("#SectionList ul").html(rows).clear()

      } else {
        var rows = "";
        $.each(data, function(i, item) {
          rows += '<li id="' + item.SectionID + '" class="col-md-8"><i class="ion-arrow-right-c"></i>' + item.SectionName + '</li>'
          rows += '<li class="col-md-4"><i><button type="submit" id="Remove" value= "' + item.SectionID + '" class="btn btn-sm btn-danger btn-circle">Remove</button></li>'
          $("#SectionList ul").html(rows);
        });
      }

    },
    error: function(err) {
      alert("Error:" + err.responseText);

    }

  });
}

$("#Create").click(function(e) {
  var data = {
    SectionName: $("#SectionName").val()
  }
  $.ajax({
    type: 'POST',
    url: '@Url.Action("Savedata")',
    data: data,
    success: function(data) {
      getSections();
      clear();
    },
    error: function(err) {
      alert("Error:" + err.responseText);

    }
  });
})

$(document).on("click", "#Remove", function(e) {


  var datas = {
    SectionID: $(this).val()
  }


  $.ajax({
    type: 'POST',
    url: '@Url.Action("Deletedata")',
    data: datas,
    success: function(datas) {

      getSections();
      clear();
      var elem = document.getElementById("datas");
      elem.parentNode.removeChild(elem);
      $(this).parent().remove();

    },
    error: function(err) {
      alert("Error:" + err.responseText);

    }
  });
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2>Index</h2>
<section class="checkout">
  <div class="container">
    <div class="row">

      <div class="col-md-6 mr-auto text-left mt40 mb40">
        <div class="section-heading">
          <h5>Assesment Creation - Section </h5>
          <hr class="">
        </div>

        <div class="col-md-4">
          <label>Section Name</label>
        </div>
        <div class="col-md-4">
          <input type="text" id="SectionName" name="FirstName"><br>

        </div>
        <div class="col-md-4">
          <button id="Create" type="submit" value="Creategg" class=" btn btn-lg btn-primary btn-square btn-appear">Add</button>
          <div />
        </div>

      </div>
      <div id="SectionList" class="col-md-12">
        <ul class="list-icons">


        </ul>
      </div>

    </div>
  </div>

</section>

＆＃13;

以下是我正在使用的Ajax调用

我的ul列表中的最后一个元素未从动态生成的列表

0 个答案: