jquery - Ajax 不会添加 div
问题描述
我有一个基本的评论部分,人们可以在其中提交反馈并回复其他人的反馈。我已经使用 ajax 提交了反馈并且它工作正常,div 被添加到父元素而不需要刷新。但是,当我尝试在反馈之前添加回复时,它不会更新内容,只有在我刷新后才会添加回复。回复 jquery
$(function () {
const $replyForm = $('#send-reply-form');
$replyForm.on('submit', function (event) {
event.preventDefault();
const dataToSend = $replyForm.serialize();
$.post($replyForm.attr('action'), dataToSend, function (serverData) {
$('.comments-list').prepend(serverData);
})
})
})
控制器:
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> AddReply(AddFeedbackViewModel model)
{
var feedbackModel = await this.feedbackService.AddReply(model);
return this.PartialView("_ReplySectionPartial", feedbackModel);
}
_ReplySectionPartial
@model FeedbackViewModel
<div class="single-comment replyComment justify-content-between d-flex">
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="~/images/blog/c6.jpg" alt="">
</div>
<div class="desc">
<h5>
<a href="#">@Model.Name</a>
</h5>
<p class="date">@Model.CreatedOn.Value.ToLongDateString()</p>
<p class="comment">
@Model.Comment
</p>
</div>
</div>
</div>
可能是什么问题,为什么在刷新之前它不会更新?
解决方案
我找到了一种解决方法,将 id 添加到父元素并使用它来添加它。
$(function () {
const $replyForm = $('#send-reply-form');
$replyForm.on('submit', function (event) {
event.preventDefault();
const dataToSend = $replyForm.serialize();
const dataArray = $replyForm.serializeArray();
var feedbackId = dataArray[0].value;
const feedbackParentElement = $('#' + feedbackId);
$.post($replyForm.attr('action'), dataToSend, function (serverData) {
$(feedbackParentElement).prepend(serverData);
})
})
})
推荐阅读
- algorithm - 给定一组边和一个无向图,我如何选择最好的边添加到图中以最小化最短路径?
- pandas - 从数据框中返回单个值作为数字
- java - 有没有办法使用spring boot rest控制器返回HTML页面作为响应?
- c++ - 如何对特征张量执行某些操作?
- outlook - Microsoft Graph API - 列表消息 API 的 @odata.count 值不准确和一致
- python - 如何创建一个 for 循环以将特定图像从一个文件夹提取到另一个文件夹?
- javascript - 无法从 Android WebView 加载 PHP 提供的 JS 文件
- android - Android Wear 布局开始太低
- excel - 如何从 Excel 中的列表中查找值并将这些文件复制到另一个目录?
- android - 对话框片段包始终为空