im trying to access the text content that is "education" in the given code stand it is written in a li element. But not the text content that are written inside the ul of that li element that is "science" and other li elements inside science. Basically, li has uls and i just want to access li content and not ul's.
<ul class="dropdown-items">
<li class="li-items">Education
<ul class="dropdown-items">
<li data-parent="Education" class="li-items">Science
<ul class="dropdown-items">
<li data-parent="Science" class="li-items">Physics</li>
<li data-parent="Science" class="li-items">Chemistry</li>
<li data-parent="Science" class="li-items">Biology</li>
</ul>
</li>
</ul>
</li>
<li class="li-items">Entertainment</li>
<li class="li-items">Spiritual</li>
</ul>
that was my html
that come out dyanamically because of following code in template:
<ul class="dropdown-items">
{% for cat in cats %}
{% if not cat.children.all %}
<li {% if cat.parent %} data-parent="{{cat.parent.name}}" {% endif %} class="li-items">{{cat.name}}
{%else%}
<li {% if cat.parent %} data-parent="{{cat.parent.name}}" {% endif %} class="li-items">{{cat.name}}
{% include "blog/category.html" with cats=cat.children.all %}
</li>
</li>
{% endif %}
{% endfor %}
</ul>
Related
Sorry because of the dumb question. I am reading a tutorial from book called build django 2 web application. and I get to the pagination topic but I can't get why it does not working even when I am copy-pasting carefully.
{% if is_paginated %}
<nav>
<ul class="pagination">
<li class="page-item">
First
</li>
{% if page_obj.has_previous %}
<li class="page-item">
{{page_obj.previous_page_number}}
</li>
{% endif %}
<li class="page-item active">
{{page_obj.number}}
</li>
{% if page_obj.has_next %}
<li class="page-item">
{{page_obj.next_page_number}}
</li>
{% endif %}
<li class="page-item">
Last
</li>
</ul>
</nav>
{% endif %}
#View
class MovieListView(ListView):
model = Movie
template_name = 'movie_list.html'
You haven't set the paginated_by attribute in the view class, so the contents won't be paginated.
class MovieListView(ListView):
model = Movie
template_name = 'movie_list.html'
paginate_by = 5
my code
<ul class="nav navbar-nav navbar-right">
{% if user.is_authenticated %}
<li> Post </li>
<li> Groups </li>
<li> Create Group </li>
<li> Log Out </li>
{% else %}
<li> Groups </li>
<li> Log In </li>
<li> Sign Up </li>
{& endif %}
error shown is
Unclosed tag on line 30: 'if'. Looking for one of: endif.
You have {& endif %}
The correct syntax is {% endif %}
I have inserted a block inside an include in hopes that I could references that block and add extra links to it if needed.
site_page.html:
{% extends 'home/sbadmin_base.html' %}
{% load extras %}
{% load static %}
{% block content %}
{% include 'sites/site_tabs.html' %}
{% block extratabs %}
<li {{ active_sims|safe }}>
Edit Site
</li>
{% endblock %}
site_tabs.html
{% load extras %}
<!-- Nav tabs -->
<ul class="nav nav-tabs">
<li {{ active_ip|safe }}>Overview
</li>
<li {{ active_files|safe }}>Files and Photos
</li>
{% block extratabs %}
{% endblock %}
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div class="tab-pane fade in active" id="ip">
<div class="row">
When my page is rendered, the "extratabs" just appear below the include and outside the list as per the below:
<!-- Nav tabs -->
<ul class="nav nav-tabs">
<li class="active">Overview
</li>
<li >Files and Photos
</li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div class="tab-pane fade in active" id="ip">
<div class="row">
<li >
Edit Site
</li>
I am developing a Django application, i had some problem,
I hope to do the following effects on Django,
<div id='cssmenu'>
<ul>
<li class='active'><a href='#'><span>Home</span></a></li>
<li><a href='#'><span>Products</span></a></li>
<li><a href='#'><span>Company</span></a></li>
<li class='last'><a href='#'><span>Contact</span></a></li>
</ul>
</div>
Django Code,
<div id='cssmenu'>
{% for child in children %}
{% cycle 'active' 'last' as cssmenu silent %}
<li class="{{ cssmenu }}">
{{ child.get_menu_title }}
{% if child.children %}
<ul>
{% show_menu from_level to_level extra_inactive extra_active template "" "" child %}
</ul>
{% endif %}
</li>
{% endfor %}
</div>
Could you help me?
That's not what cycle is for: it's for alternating between two or more alternatives. You don't want that at all.
Instead, just use the forloop attributes:
{% for child in children %}
<li class="{% if forloop.first %}active{% elif forloop.last %}last{% endif %}">...</li>
{% endfor %}
Although I suppose you don't want the first one to always be active, but you haven't given any information about how you do want to determine where 'active' goes.
I am using django mptt to display navigational menu.
{% load mptt_tags %}
<ul class="nav_menu">
{% recursetree nav_link.get_descendants %}
{% if node.is_shown %}
<li>
{{ node.title }}
{% if not node.is_leaf_node %}
<ul class="nav_menu">
{{ children }}
</ul>
{% endif %}
</li>
{% endif %}
{% endrecursetree %}
</ul>
Is there a way to mark each first child of each nav_menu with a class first-child and to mark each last child of each nav_menu with a class last-child?
For example:
<ul class="nav_menu">
<li class="first-child">
Node 1
<ul class="nav_menu">
<li class="first-child last-child">
Node 1.1
</li>
</ul>
</li>
<li>
Node 2
<ul class="nav_menu">
<li class="first-child">
Node 2.1
</li>
<li class="last-child">
Node 2.2
</li>
</ul>
</li>
<li class="last-child">
Node 3
</li>
</ul>
A node can know whether or not it is the first or last at its level by querying get_previous_sibling and get_next_sibling.
<a class="{% if not node.get_previous_sibling %}first_child {% endif %}{% if not node.get_next_sibling %}last_child{% endif %} href="{{ node.url }}">{{ node.title }}</a>
These calls should work on the node cache, so won't hit the database. However, CSS already has pseudo-selectors for first-child and last-child, so it might be better to just do any styling using those rather than with explicit classes unless you're targeting older browsers.
If not all items in the database should be shown depending on a calculated value for each node, then first item and last item in the database don't necessary match first item and last item in the list. In this case, the first item and last item can be marked by javascript/jquery:
$(document).ready(function() {
$('.nav_menu li:first-child').addClass("first-child");
$('.nav_menu li:last-child').addClass("last-child");
});