如何使用 jquery 动态刷新和显示列表？

Posted 2023-04-13

【中文标题】如何使用 jquery 动态刷新和显示列表？

【英文标题】：how to dynamically refresh and display the list with jquery?

【发布时间】：2019-11-06 06:57:45

【问题描述】：

我正在添加评论部分，但在显示它们时遇到了一些问题。这是我的保存方法

[HttpPost]
public JsonResult AddComment(int id_usr,string comment)

   if (ModelState.IsValid)
   
       Comments kom = new Comments();
       kom.DateComment = DateTime.Now;
       kom.Id_usr = id_usr;
       kom.Comment = comment;
       db.Comments.Add(kom);
       db.SaveChanges();
       return Json(kom);
   
   return Json(null);

获取评论值并保存onClick

var url = window.location.pathname;
var idurl = url.substring(url.lastIndexOf('/') + 1);
$('#submit').click(function () 
  console.log('click')
  $.ajax(
  url: '/form/AddComment',
  method: 'POST',
  data: 
        comment: $("#Comments_Comment").val(),
        id_usr: idurl,
  ,
  success: function (data) 
         console.log(data), //to this point all is working

我尝试在列表中显示它看起来像：（只需要日期时间和评论文本）

$("#Comments2_Comment").empty(); 
data.forEach(function (item) 
var rows = "<ul>"
+ "<li>" + item.DateComment + "</li>"
+ "<li>" + item.Comment + "</li>"
+ "</ul>";
$('#Comments2_Comment').append(rows);
);

,

不幸的是它给了我：“TypeError：data.forEach 不是函数” 它应该是什么样子？

我想得到这样的东西

2019-06-19: qwertyu 2019-06-19: asdfghj

【问题讨论】：

确保data 是一个数组而不是一个对象

您正在尝试迭代对象。您必须调试您的 data 变量。您只能遍历数组。

data 是一个对象，那么如何在我的 cmets 列表顶部显示它？

请在您的问题示例中添加您的数据对象，我们将为您提供帮助

【参考方案1】：

好的，这是您可以执行的操作的一个简单示例。我刚刚创建了一个 JSON 字符串并将其解析为一个对象以进行演示，但您将使用自己的对象。然后你只需要使用 jQuery 的 $.each 循环遍历它就可以了。让我知道它是否对您有帮助。

let data = '"names":["name":"Michael S.","name":"Jim H.","name":"Pam B."]'

data = JSON.parse(data)

let str = '';

$.each(data.names, (key, val) => 
  str += '<ul><li>' + val.name + '</li></ul>'
)

$('#myDiv').empty().append(str)

li 
  background-color: yellow;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="myDiv">
</div>

【讨论】：

我只需要$('#MyEditor').empty() 和$('#MyDiv').append("<li>" + data.DateComment + ' ' + data.Comment + "</li>"); ty 来回答这很有帮助