I have added in a template pagination I found and it works fine but wont centre on page 1 even with "text-centre" and "justify-content-center" as recommended by other answers. It looks fine on page 2 and 3... as can be seen below
{% block pagination %}
{% if is_paginated %}
<div class="text-center">
<ul class="pagination justify-content-center">
{% if page_obj.has_previous %}
<li>«</li>
{% else %}
<li class="disabled"><span>«</span></li>
{% endif %}
{% for i in paginator.page_range %}
{% if page_obj.number == i %}
<li class="active"><span>{{ i }} <span class="sr-only">(current)</span></span></li>
{% else %}
<li>{{ i }}</li>
{% endif %}
{% endfor %}
{% if page_obj.has_next %}
<li>»</li>
{% else %}
<li class="disabled"><span>»</span></li>
{% endif %}
</ul>
</div>
{% endif %}
{% endblock %}
This is the code i used and this is what it looks like on page 1 and its pulling to the right. I currently don't have any CSS code for the pagination, though I have tried different options with no luck.
If I remove the "text-centre" then page 1 is centred but pages 2/3 pull to the left, so I am a bit stumped.
p.s this is my first django post so please let me know if it needs more information etc.
Thank you!
edit: Added this to CSS but didn't work -
.pagination {
justify-content: center;
}
tried d-flex class from a different answer, page 1 centred pages 2/3 pull left:
{% block pagination %}
{% if is_paginated %}
<div class="container">
<div class="row">
<div class="col-lg-6 offset-lg-3 py-5 border d-flex">
<ul class="pagination mx-auto">
{% if page_obj.has_previous %}
<li>«</li>
{% else %}
<li class="disabled"><span>«</span></li>
{% endif %}
{% for i in paginator.page_range %}
{% if page_obj.number == i %}
<li class="active"><span>{{ i }} <span class="sr-only">(current)</span></span></li>
{% else %}
<li>{{ i }}</li>
{% endif %}
{% endfor %}
{% if page_obj.has_next %}
<li>»</li>
{% else %}
<li class="disabled"><span>»</span></li>
{% endif %}
</ul>
</div>
</div>
</div>
</div>
Managed to figure it out, in case anyone has the same issue, i needed to use similar layout classes to those i had on the rest of the page (silly me), such as "container-wrap" and "col-md-6 col-md-offset-3 text-center":
{% block pagination %}
{% if is_paginated %}
<div class="container-wrap">
<div class="row">
<div class="col-md-6 col-md-offset-3 text-center">
<ul class="pagination mx-auto">
{% if page_obj.has_previous %}
<li>«</li>
{% else %}
<li class="disabled"><span>«</span></li>
{% endif %}
{% for i in paginator.page_range %}
{% if page_obj.number == i %}
<li class="active"><span>{{ i }} <span class="sr-only">(current)</span></span></li>
{% else %}
<li>{{ i }}</li>
{% endif %}
{% endfor %}
{% if page_obj.has_next %}
<li>»</li>
{% else %}
<li class="disabled"><span>»</span></li>
{% endif %}
</ul>
</div>
</div>
</div>
{% endif %}
{% endblock %}
Related
So, I found the below Django source code file on the internet.
generic_subnavigation.html
{% load common_tags %}
{% load navigation_tags %}
{% if link|common_get_type == "<class 'mayan.apps.navigation.classes.Menu'>" %}
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true">
{% if link.icon %}{{ link.icon.render }}{% endif %}
{{ link.label }}
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
{% navigation_resolve_menu name=link.name as sub_menus_results %}
{% for sub_menu_results in sub_menus_results %}
{% for link_group in sub_menu_results.link_groups %}
{% with '' as li_class_active %}
{% with link_group.links as object_navigation_links %}
{% include 'navigation/generic_navigation.html' %}
{% endwith %}
{% endwith %}
{% endfor %}
{% endfor %}
</ul>
</li>
{% else %}
{% if as_li %}
<li class="{% if link.active and li_class_active %}{{ li_class_active }}{% endif %}">
{% endif %}
{% include link_template|default:'navigation/generic_link_instance.html' %}
{% if as_li %}
</li>
{% endif %}
{% endif %}
The code renders a webpage with sub-menus shown in the picture below;
How do I remove the "setup and tools" menu in the sub-menus shown in the picture? At least comment on it out.
generic_link_instances.html
{% if link.separator %}
<li role="separator" class="divider"></li>
{% elif link.text_span %}
<li class="text-center link-text-span {{ link.html_extra_classes }}" >{{ link.text }}</li>
{% else %}
{% if link.disabled %}
<a class="{{ link.html_extra_classes }} {% if link_classes %}{{ link_classes }} {% else %}btn {% if 'dangerous' in link.tags %}btn-danger{% else %}btn-primary{% endif %} btn-xs{% endif %} {% if link.active %}{{ link_class_active }}{% endif %} {% if 'new_window' in link.tags %}new_window{% endif %} disabled" disabled='disabled' style="cursor: default;" href="#">{% if link.icon %}{{ link.icon.render }}{% endif %} {{ link.text }}{% if link.error %} - {{ link.error }}{% endif %}</a>
{% else %}
<a
class="{{ link.html_extra_classes }} {% if link_classes %}{{ link_classes }} {% else %}btn {% if 'dangerous' in link.tags %}btn-danger{% else %}btn-primary{% endif %} btn-xs{% endif %} {% if link.active %}{{ link_class_active }}{% endif %} {% if 'new_window' in link.tags %}new_window{% endif %}"
{% for key,value in link.html_data.items %}
data-{{ key }}={{ value }}
{% endfor %}
{% if link.html_extra_attributes %}{{ link.html_extra_attributes }}{% endif %}
{% if link.url %}href="{{ link.url }}"{% endif %}
>{% if link.icon and not hide_icon %}{{ link.icon.render }}{% endif %}
{{ link.text|default:'' }}{% if link.badge_text %} <span class="badge">{{ link.badge_text }}</span>
{% endif %}{% if link.error %} - {{ link.error }}{% endif %}
</a>
{% endif %}
{% endif %}
generic_navigation.html
{% load i18n %}
{% for link in object_navigation_links %}
{% include 'navigation/generic_subnavigation.html' %}
{% endfor %}
action_dropdown.html
{% load i18n %}
{% load common_tags %}
<button aria-expanded="false" aria-haspopup="true" class="{{ action_dropdown_classes|default:"btn btn-default btn-danger"}} btn-sm dropdown-toggle" data-toggle="dropdown" type="button">
{% if action_dropdown_label %}
{{ action_dropdown_label }}
{% else %}
{% trans 'Actions' %}
{% endif %}
<span class="caret"></span>
<span class="sr-only">{% trans 'Toggle Dropdown' %}</span>
</button>
<ul class="dropdown-menu" role="menu">
{% for menus_link_result in action_menus_link_results %}
{% if not action_menu_disable_labels and action_menus_link_results|length > 1 %}
<li class="dropdown-header"><strong>{{ menus_link_result.menu.label }}</strong></li>
<li class="divider"></li>
{% endif %}
{% for link_group in menus_link_result.link_groups %}
{% if navigation_object_list %}
{% ifchanged link_group.object %}
{% common_get_object_verbose_name obj=link_group.object as link_group_object_verbose_name %}
{% if link_group_object_verbose_name %}<li class="dropdown-header">{{ link_group_object_verbose_name }}</li>{% endif %}
{% endifchanged %}
{% endif %}
{% with link_group.links as object_navigation_links %}
{% with 'true' as as_li %}
{% with 'true' as hide_active_anchor %}
{% with 'btn btn-sm navigation-btn-dropdown' as link_classes %}
{% include 'navigation/generic_navigation.html' %}
{% endwith %}
{% endwith %}
{% endwith %}
{% endwith %}
{% if not forloop.last and link_group %}
<li class="divider"></li>
{% endif %}
{% endfor %}
{% if not forloop.last and menus_link_result %}
<li class="divider"></li>
{% endif %}
{% endfor %}
</ul>
when Making django board, I met the problem.
django version is 3.
I wanted form like this. but my code can't alert me "This field is required"
But widget tweaks form-control wasn't working.
which part is problem?
My code is like this
{% extends 'base.html' %}
{% load widget_tweaks %}
{% block title %}Start a New Topic{% endblock %}
{% block breadcrumb %}
<li class="breadcrumb-item">Boards</li>
<li class="breadcrumb-item">{{ board.name }}</li>
<li class="breadcrumb-item active">New topic</li>
{% endblock %}
{% block content %}
<form method="post" novalidate>
{% csrf_token %}
{% for field in form %}
<div class="form-group">
{{ field.label_tag }}
{% if form.is_bound %}
{% if field.errors %}
{% render_field field class="form-control is-invalid" %}
{% for error in field.errors %}
<div class="invalid-feedback">
{{ error }}
</div>
{% endfor %}
{% else %}
{% render_field field class="form-control is-valid" %}
{% endif %}
{% else %}
{% render_field field class="form-control" %}
{% endif %}
{% if field.help_text %}
<small class="form-text text-muted">
{{ field.help_text }}
</small>
{% endif %}
</div>
{% endfor %}
<button type="submit" class="btn btn-success">Post</button>
</form>
{% endblock %}
Try using bootstrap or django crispy forms in your form.
just change your code to blow with proper indent
{% load widget_tweaks %}
{% block title %}Start a New Topic{% endblock %}
{% block breadcrumb %}
<li class="breadcrumb-item">Boards</li>
<li class="breadcrumb-item">{{ board.name }}</li>
<li class="breadcrumb-item active">New topic</li>
{% endblock %}
{% block content %}
<form method="post" novalidate>
{% csrf_token %}
{% for field in form %}
<div class="form-group">
{{ field.label_tag }}
{% if form.is_bound %}
{% if field.errors %}
{% render_field field class="form-control is-invalid" %}
{% for error in field.errors %}
<div class="invalid-feedback">
{{ error }}
</div>
{% endfor %}
{% else %}
{% render_field field class="form-control is-valid" %}
{% endif %}
{% else %}
{% render_field field class="form-control" %}
{% endif %}
{% if field.help_text %}
<small class="form-text text-muted">
{{ field.help_text }}
</small>
{% endif %}
</div>
{% endfor %}
<button type="submit" class="btn btn-success">Post</button>
</form>
{% endblock %}```
I have a ListView page that is working well with pagination. I also have Django filter added to that page for filtering. The problem is pagination is working well but with Django filter it stops working. When the page loads paginate_by is not working. When the pagination is clicked the next page not working.
What am I doing wrong?
views.py
class JobsListView(ListView, FilterView):
# model = JobPost
queryset = JobPost.objects.all()
template_name = 'jobpost_list.html'
paginate_by = 3
# page_kwargs = 'page'
filterset_class = JobPostFilter
def get_queryset(self, *args, **kwargs):
if self.kwargs:
return JobPost.objects.filter(position=self.kwargs['position']).order_by('-created_at')
else:
query = JobPost.objects.all().order_by('-created_at')
return query
def get_context_data(self, **kwargs):
context = super().get_context_data(**kwargs)
context['todays'] = date.today()
context['filter'] = JobPostFilter(self.request.GET, queryset=self.get_queryset())
return context
template
{% extends 'base.html' %}
{% load bootstrap4 %}
{% load fontawesome %}
{% block content %}
{% if messages %}
<div class="alert alert-success alert-dismissible fade show">
{% for m in messages %}
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>{{ m }}</li>
<button type="button" class="close" data-dismiss="alert" aria-
label="Close">
<span aria-hidden="true">×</span>
</button>
{% endfor %}
</div>
{% endif %}
<div class="col-12">
<h1 class="text-center">Vacancies</h1>
</div>
<div class="row">
<div class="col-4">
<form method="get">
{% bootstrap_form filter.form %}
{% buttons %}
<button class="btn btn-primary" type="submit">Search {% fontawesome_icon
'search' %}</button>
{% endbuttons %}
</form>
</div>
<div class="col-8">
{% for job in filter.qs %}
<div class="joblists">
<h3><a href='{% url "jobpost_detail" job.slug %}'>{{ job.position }} </a> <a
href="{% url 'jobpost_update_form' job.slug %}">{% fontawesome_icon 'edit' %}
</a></h3>
<p>{{ job.description|safe|truncatewords:30 }}</p>
{% if job.location != '' %}
<p>{% fontawesome_icon 'location-arrow' %} <strong>{{ job.location }}
</strong>
</p>
{% endif %}
<p>{{ job.job_type }}</p>
{% if job.deadline != NULL and job.deadline > todays %}
<p>{% fontawesome_icon 'calendar' %} {{ job.deadline|timeuntil }} <small>to
deadline</small></p>
{% endif %}
{% if job.deadline > todays %}
<p>{% fontawesome_icon 'check-circle' color='green' %} Open</p>
{% elif job.deadline < todays %}
<p>{% fontawesome_icon 'times-circle' color='red' %} Closed</p>
{% endif %}
</div>
{% endfor %}
</div>
<div class="pagination">
{% if is_paginated %}
<hr>
<nav aria-label="Page navigation example">
<ul class="pagination justify-content-center pagination-sm">
{% if page_obj.has_previous %}
{% if not search %}
<li class="page-item">
<a class="page-link" href="{% url 'jobpost_list' %}?page={{
page_obj.previous_page_number }}" tabindex="-1">Previous</a>
</li>
{% else %}
<li class="page-item">
<a class="page-link" href="{% url 'jobpost_list' %}?{{search}}&page=
{{ page_obj.previous_page_number }}" tabindex="-1">Previous</a>
</li>
{% endif %}
{% else %}
<li class="page-item disabled">
<a class="page-link" href="#" tabindex="-1">Previous</a>
</li>
{% endif %}
{% for object in page_obj.paginator.page_range %}
<li class="page-item"><a class="page-link" href="{% url 'jobpost_list'
%}?page={{ forloop.counter }}">{{ forloop.counter }}</a></li>
{% endfor %}
{% if page_obj.has_next %}
{% if not search %}
<li class="page-item">
<a class="page-link" href="{% url 'jobpost_list' %}?page={{
page_obj.next_page_number }}">Next</a>
</li>
{% else %}
<li class="page-item">
<a class="page-link" href="{% url 'jobpost_list' %}?{{search}}&page=
{{ page_obj.next_page_number }}">Next</a>
</li>
{% endif %}
{% else %}
<li class="page-item disabled">
<a class="page-link" href="#">Next</a>
</li>
{% endif %}
</ul>
</nav>
{% endif %}
</div>
{% endblock %}
in {% for job in filter.qs %} if you replace filter.qs with 'object_list' it pagination and filtering will work. BUT This won't have any records when the page loads initially without any filter params set in the url.
I am trying to figure out what can be done. Searching....
I have created a admin panel on the frontend and would like to show different layouts if they are on the index.html or if they are on pages after /admin e.g:
/admin/dashboard
/admin/posts
/admin/media
My if statement:
{% if request.path == "/admin" %}
It doesn't work for some reason and I can't figure out why. This is an example of the whole if:
<div class="row">
{% if request.path == "/admin" %}
<div class="col-md-full">
{% else %}
<div class="col-md-7 left">
{% block main %}{% endblock %}
</div>
{% endif %}
{% if request.path == "/admin" %}
{% trans "Empty" %}
{% else %}
<div class="col-md-3 right">
<div class="panel panel-default">
<div class="panel-body">
{% block right_panel %}
{% endblock %}
</div>
</div>
</div>
{% endif %}
</div>
what about?
{% if '/admin/' in request.path %}
I have the following code in a template and am having difficulty showing when a user is logged in. I will be able to login, but when I revisit the page, it shows that I'm still not authenticated.
{% extends "base.html" %}
{% load catalog_tags %}
{% block site_wrapper %}
<div id = "main">
Skip to main content
<div id = "banner">
<div class="bannerIEPadder">
<div class="cart_box">
{% cart_box request %}
</div>
</div>
</div>
<div style="float:right;">[search box goes here]</div>
<div id="navigation">
<div class="navIEPadder">
<!--navigation tabs at the top of each page -->
{% comment %}{% include "tags/navigation.html" %} {% endcomment %}
{% category_list request.path %}
</div>
</div>
<div id="middle">
<div id="sidebar">
<!--<div class="sidebarIEPadder">[search box goes here]</br>
{% comment %}{% category_list request.path %}{% endcomment %}
</div>-->
</div>
<div id="content">
<!-- <a name = "content"></a>-->
<div class="contentIEPadder">
{% block content %}{% endblock %}
</div>
</div>
</div>
<div id="footer">
<div class="footerIEPadder">
{% footer_links %}
</div>
</div>
</div>
{% endblock %}
And here's the file it references. Since this will be an extension of all templates, is there something I need to consider?
###category_list.html
<!--<h3>Categories</h3>-->
<!--<ul id="categories">-->
<ul>
{% with active_categories as cats %}
{% for c in cats %}
<li>
{% comment %}
{% ifequal c.get_absolute_url request_path %}
{{c.name}}
{% else %}
{% endcomment %}
<div>{{c.name}}</div>
{% comment %}{% endifequal %}{% endcomment %}
</li>
{% endfor %}
<div class="fr">
<ul>
<li>
{% if user.is_authenticated %}
Logout
{% else %}
Login
{% endif %}
</li>
</div>
{% endwith %}
</ul>
<div class="cb"></div>
Am I missing something here?
You need to pass a RequestContext to the template. The easiest way to do this is to import django.shortcuts and use the render method in your view:
return render(request, "my_template.html")
Is django.contrib.auth.context_processors.auth in your TEMPLATE_CONTEXT_PROCESSORS setting.py?
Do you use requestContext rendering template?
Check that sessions are enabled: MIDDLEWARE_CLASSES should contains 'django.contrib.sessions.middleware.SessionMiddleware'