Динамическое меню с подменю в HTML - PullRequest
Новая
       16

Динамическое меню с подменю в HTML

0 голосов
/ 20 сентября 2009

У меня есть меню, которое выглядит примерно так: 

<ul id="menu_cat">
    <li><a class="cat1" href="#">category 1</a>
    <ul>
    <li><a class="cat2" href="#">category 2</a>
        <ul>
            <li><a class="cat3" href="#">category 3</a></li>
            <li><a class="cat3" href="#">category 3</a></li>
            <li><a class="cat3" href="#">category 3</a></li>
        </ul>       
    </li>
    <li><a class="cat2" href="#">Category 2</a>
        <ul>
            <li><a class="cat3" href="#">category 3</a></li>
            <li><a class="cat3" href="#">category 3</a></li>
            <li><a class="cat3" href="#">category 3</a></li>
        </ul>
    </li>
    <li><a class="cat2" href="#">Category 2</a>
        <ul>
            <li><a class="cat3" href="#">Category 3</a></li>
            <li><a class="cat3" href="#">category 3</a></li>
            <li><a class="cat3" href="#">category 3</a></li>
        </ul> 
    </li>
    </ul> <!-- End of CAT1-->
    </li> <!-- End of .Krmiva -->
</ul>

Теперь мне нужно сделать его динамичным, чтобы «Категории 1, 2, 3» были взяты из базы данных MySQL, но я могу думать о любом другом решении, кроме как сделать что-то вроде 3 таблиц для CAT1, CAT2, CAT3 и для каждого элемента в CAT1, выбирая подменю из CAT2, и для каждого CAT2, выбирая подменю из CAT3 ... что означало бы сделать 20 SELECT * FROM запросов.

Есть идеи? Спасибо, Майк.

Ответы [ 2 ]

3 голосов
/ 20 сентября 2009

Лучше всего просто иметь таблицу категорий, которая включает поле «Родитель», тогда все, что вам нужно сделать, это рекурсивно выбрать каждую категорию на основе ее родителя.

Итак, сначала найдите первую категорию без каких-либо родителей (или корневого родителя 0), затем выберите первую категорию, которая имеет предыдущую категорию в качестве родительской. И так до тех пор, пока категория, в которой вы находитесь, не имеет дочерних элементов, затем вернитесь к таблице, повторяя процесс.

Статьи сайта, ссылки на которые содержатся в комментарии Eimantas, дают очень подробное описание этого: Хранение иерархических данных в базе данных

0 голосов
/ 20 сентября 2009

Да, Джейми правильно сделал. Вы можете сохранить в базе данных таким образом или другой альтернативой. Вы можете подготовить рекурсивный цикл для того же.

если его 2 уровня, я думаю, он будет работать хорошо, но для множественной иерархии вам нужно настроить свой CSS.

...