点击Django应用程序刷新显示的数据

Question

我正在使用Ajax获取适当的url，该url根据日历中单击的日期显示订单。这是有效的，但每次用户单击日期时，内容都会重复，而不会删除以前的显示。

https://i.stack.imgur.com/nEdWg.png

当用户再次单击某个日期时，我希望刷新内容。我该怎么做？

我在搜索"Jquery刷新DIV"，偶然发现了location.reload((、ajax.reload(((、Jquery加载方法和类似的解决方案。我试着实现这些，但不确定它们是否适合我的情况。

这是我的密码。请告诉我是否应该发布其他内容。感谢您的帮助。

.js

$(function () {
var $archive = $('#orders-per-day');
$(".day-click").click(function (event) {
event.preventDefault();
var day = $(this)[0].innerText;
var month = $(".month")[0].innerText.substring(0, 3);
var year = $(".month")[0].innerText.substr(-4);
console.log(year);
$.ajax({
type: 'GET',
url: `/ocal/date/${year}/${month}/${day}/`,
success: function (data) {
$archive.append(data);
}
})
});
});

显示一天订单的html template

{% extends 'ocal/base.html' %}
{% block content %}
<h1>Orders for {{ day }}</h1>
<ul>
{% if object_list %}
{% for order in object_list %}
<li>
<a href="/ocal/{{ order.id }}/detail">Order {{ order.id }} </a>
{{ order.status_str }}
</li>
{% endfor %}
{% else %}
<p>No orders</p>
{% endif %}
</ul>
{% endblock %}

python文件中的代码，在该文件中创建类Calendar，并将日期格式化为表数据。

return f"<td><a href='' id='day_{day}' class='day-click' value='{day}'><span class='date'>{day}</span><ul>{d}</ul></a></td>"

Answer 1

$archive.append(data)按照函数所述追加。

您应该使用占位符<div>，以便替换内容。$archive.html(data)会这么做，只是我不确定$archive在这种情况下是正确的div。但你明白了。