Question

我想使用Django / jQuery过滤公司的简单数据库，而无需重新加载页面。在页面顶部，有许多复选框，用户可以在其中例如选择国家。在这些复选框下面，有一个包含相应数据库条目的表。我试图使用jQuery的load（）函数来完成我的目标，但是整个页面不断重新加载而不仅仅是我需要的div ID。

我的模板（main_view.html）看起来像这样：

<form id="filters">
<input type="checkbox" id="USA" name="s" value="USA">USA
<input type="checkbox" id="UK" name="s" value="UK">UK
<button id="submitButtonId">Submit</button>
</form>

<div id="companylist">
<tr>
  <td><b>Name</b></td>
  <td><b>Country</b></td>
</tr>
{% for company in companies %}
<tr>
  <td>{{ company.name }}</td>
  <td>{{ company.country }}</td>
</tr>
{% endfor %}
</table>
</div>

<script>
$("#submitButtonId").click(function() {
$.ajax({
  type: "GET",
  url: "/",
  dataType: "html",
  data: $("#filters").serialize(),
  success: function(data)
  {
      $(#companylist).load('?' + data #companylist)
  }
  });
return false;
});
</script>

我的views.py的结构如下：

def main_view(request):
  filter_countries = request.GET.getlist('c')
  if filter_query:
      companies = Company.objects.filter(country__in=filter_countries)
  else:
      companies = Company.objects.all()
  return render(request, 'database/main_view.html', {'companies': companies})

Answer 1

您没有发布main-view.html代码。确保此html模板仅是您要刷新的部分。不是整个页面

如何通过Django中的Ajax提交表单并仅重新加载页面的一部分？

1 个答案: