Django分页-查询参数(url)



我目前正在使用Django web框架的待办事项应用程序。我有两个单独的容器(列表),这是即将到来的项目和完成的待办事项。此外,我不确定如何添加这个功能,如果我点击第3页in即将发布的项目,然后点击page-2incompleted Items我在即将进行的项目中重定向到第1页,在已完成的项目中重定向到第2页。我不想这样。我想在即将到来的第三页和完成的第二页。有什么方法可以用Django或JavaScript来做吗?

我还附上了我创建的app的图片。

models.py

class Todo(models.Model):
date_created = models.DateTimeField(auto_now_add=True)
completed = models.BooleanField(default=False)
title = models.CharField(max_length=200)
user_id = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
def __str__(self):
return self.title

views.py

def home(request):
todo_form = TodoForm()
current = timezone.now()
todo_items_upcoming = Todo.objects.filter(user_id=request.user, completed=False).order_by('-date_created')
todo_items_completed = Todo.objects.filter(user_id=request.user, completed=True)
pagi1 = Paginator(todo_items_upcoming, 4)
pagi2 = Paginator(todo_items_completed, 4)
page_num = request.GET.get('upcoming', 1)
page_num2 = request.GET.get('completed', 1)
page_obj = pagi1.get_page(page_num)
page_obj2 = pagi2.get_page(page_num2)
if request.method == "POST":
todo_form1 = TodoForm(request.POST)
if todo_form1.is_valid():
data = todo_form1.cleaned_data.get('title')
obj = Todo.objects.create(date_created=current, title=data, user_id=request.user)
context = {'todo_form':todo_form, 'page_obj':page_obj, 'page_obj2':page_obj2, 'pagi1':pagi1, 'pagi2':pagi2,
'page_num2':int(page_num2),'page_num':int(page_num)}
return render(request, 'todo/main.html', context)

main.html

{% extends 'todo/index.html' %}
{% load crispy_forms_tags %}

{% block content %}

<div class="center-column">
<h2 class="heading">Hello {{ request.user.username }}, Here's your ToDo List</h2>

<form action="" method="POST" id='form-create'>
{% csrf_token %}        
<div class="input-group-append">
{{ todo_form.title}}
<button type="submit" class="form-control btn btn-primary mb-3 mr-sm-2" id="addItem">Add Items</button>
</div>
</form>


<!-- Upcoming To DO Items -->
<h4 class="heading">Upcoming ToDo Items</h4>

<ul class="pagination justify-content-center">
{% for i in pagi1.page_range %}
<li class="page-item {% if i == page_num %} active {% endif %}">
<a class="page-link" href="?upcoming={{ i }}">{{ i }}</a>
</li>
{% endfor %}
</ul>
<div class="row">
<div class="col" id="upcomItem">
<ul class="list-group" id="upcomingItems">
{% for i in page_obj %}
<li class="list-group-item list-group-item-primary mb-2" id="upcomingItem">{{ i.title }}
<div class="float-right">
<button type="submit" class="btn-sm btn-danger ml-2 mt-2 mr-2 mb-1"><a href="{% url 'delete_todo' i.id %}">Delete</a></button>

</div>
<div class="float-right">
<button type="submit" class="btn-sm btn-success ml-2 mt-2 mr-2 mb-1" id="update_btn"><a href="{% url 'update_todo' i.id %}">Update</a></button>
</div>
<div class="float-right">

<button type="submit" class="btn-sm btn-dark ml-2 mt-2 mr-2 mb-1" id="completed_btn"><a href="{% url 'completed_todo' i.id %}">Completed</a></button>
</div>              

</li>

{% endfor %}                    

</ul>

</div>
</div>
</div>

<!-- Completed To Do Items -->
<div class="center-column">
<h4 class="heading">Completed ToDo Items</h4>

<ul class="pagination justify-content-center">
{% for i in pagi2.page_range %}
<li class="page-item {% if i == page_num2 %} active {% endif %}">
<a class="page-link" href="?completed={{ i }}">{{ i }}</a>
</li>
{% endfor %}
</ul>
<div class="row">
<div class="col" id="upcomItem">
<ul class="list-group" id="upcomingItems">
{% for i in page_obj2 %}
<li class="list-group-item list-group-item-primary mb-2" id="upcomingItem">{{ i.title }}
<div class="float-right">
<button type="submit" class="btn-sm btn-danger ml-2 mt-2 mr-2 mb-1"><a href="{% url 'delete_todo' i.id %}">Delete</a></button>

</div>
<div class="float-right">
<button type="submit" class="btn-sm btn-success ml-2 mt-2 mr-2 mb-1" id="update_btn"><a href="{% url 'update_todo' i.id %}">Update</a></button>
</div>          

</li>

{% endfor %}                    

</ul>

</div>
</div>
</div>
{% endblock %}

forms.py

class TodoForm(forms.ModelForm):

class Meta:
model = Todo
fields = ['title', 'completed']

在HTML模板中更新缺少url查询字符串的相应url,即在已完成的待办事项列表中添加upcoming,在即将到来的列表中添加completed。例如:

// upcoming
<li class="page-item {% if i == page_num %} active {% endif %}">
<a class="page-link" href="?upcoming={{ i }}&completed={{ page_num2 }}">{{ i }}</a>
</li>
// completed
<li class="page-item {% if i == page_num2 %} active {% endif %}">
<a class="page-link" href="?completed={{ i }}&upcoming={{ page_num }}">{{ i }}</a>
</li>

你必须使用一个脚本来调用分页。

当你点击分页链接将重定向到? upcoming =10 URL将像www.xyz.com?upcomming=10

点击完成后,新的URL将是www.xyz.com?completed=11

你的旧URL将被覆盖。

在你的代码中,你已经写了,如果即将到来的不是在GET,那么采取默认值1。这就导致了这个问题

使用onclick事件来解决这个问题。在里面

var href = new URL(window.location.href)
href.searchParam.set('upcomming',value)
href.searchParam.set('completed',value)
window.location.href = href.toString()
所以你的新URL将会是www.xyz.com?completed=11&upcomming=25

最新更新