Определение первого и последнего элемента для каждого уровня в django-mptt - PullRequest
0 голосов
/ 20 января 2012

Я использую django mptt для отображения навигационного меню.

{% load mptt_tags %}
<ul class="nav_menu">
    {% recursetree nav_link.get_descendants %}
        {% if node.is_shown %}
            <li>
                <a href="{{ node.url }}">{{ node.title }}</a>
                {% if not node.is_leaf_node %}
                    <ul class="nav_menu">
                        {{ children }}
                    </ul>
                {% endif %}
            </li>
        {% endif %}
    {% endrecursetree %}
</ul>

Есть ли способ пометить каждого первого ребенка каждого nav_menu классом first-child и отметить каждого последнего ребенка каждогоnav_menu с классом last-child?

Например:

<ul class="nav_menu">
    <li class="first-child">
        <a href="">Node 1</a>
        <ul class="nav_menu">
           <li class="first-child last-child">
              <a href="">Node 1.1</a>
           </li>
        </ul>
    </li>
    <li>
        <a href="">Node 2</a>
        <ul class="nav_menu">
           <li class="first-child">
              <a href="">Node 2.1</a>
           </li>
           <li class="last-child">
               <a href="">Node 2.2</a>
           </li>
        </ul>
    </li>
    <li class="last-child">
        <a href="">Node 3</a>
    </li>
</ul>

Ответы [ 2 ]

2 голосов
/ 20 января 2012

Узел может узнать, является ли он первым или последним на своем уровне, путем запроса get_previous_sibling и 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>

Эти вызовы должны работать в кеше узла, поэтому выиграл 'т ударил базу данных.Тем не менее, в CSS уже есть псевдо-селекторы для first-child и last-child, поэтому может быть лучше сделать любое стилирование, используя их, а не явные классы, если вы не ориентируетесь на старые браузеры.

0 голосов
/ 24 января 2012

Если не все элементы в базе данных должны отображаться в зависимости от вычисленного значения для каждого узла, то первый элемент и последний элемент в базе данных не обязательно должны совпадать с первым элементом и последним элементом в списке. В этом случае первый элемент и последний элемент могут быть помечены javascript / jquery:

$(document).ready(function() {
    $('.nav_menu li:first-child').addClass("first-child");
    $('.nav_menu li:last-child').addClass("last-child");
});
...