Nomad
Nomad17 октября 2020 г. 1:18

Создание иерархии в виде дерева для фронта приложения на Джанго.

django, mptt

Всем привет.

Всем надеюсь известен замечательный django-mptt.

Я стал его изучать и тут у меня возник вопрос:

а есть ли такой же функционал НО для фронта, то есть создаеш модель, форму, представления и чтобы форму закинуть в какой то темплейт и мог бы создавать не лету свое многоуровневое дерево.

если кто встречал поделитесь пожалуйста инфой.

или если есть какие то хорошие статейки на тему создания такого функционала то опять же прошу поделиться

как я понимаю если делать такой функционал то надо использовать связку formset + ajax !

Рекомендуем хостинг TIMEWEB
Рекомендуем хостинг TIMEWEB
Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.

Вам это нравится? Поделитесь в социальных сетях!

7
Илья Чичак
  • 17 октября 2020 г. 1:52

можешь чуть подробнее описать, что хочешь получить?
какие данные на вход? json?
что на выходе?
можно сам флоу описать, типа форма, загружаю json, отрисовывается дерево. это например просто построить дерево на js - не великая сложность, простая рекурсивная функция

    Nomad
    • 17 октября 2020 г. 17:51

    все просто, представьте себе следуешее:

    открываем браузер, вписываем адрес и открывается страница:

    и мы начинаем с лева добавлять элементы в дереве а с права для каждого элемента какой то контент, вот еше несколько скринов:

    при этом, в итоге мы получаем "документ" со своей структурой, для каждого пункта есть свой контент, все это дерево надо сохранить в базе, надо сохранить так чтобы и порядок и контент и все
    то есть если нам надо будет просто просмотреть сохраненные "документы" то мы должны выташить из базы данные (тайтлы) дерева и упорядочить их правельно.

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

    ну конечно если к данному функционалу добавить еше возможность drag-and-drop, то есть находу менять порядок элементов в данном дереве то вооше получится бомба пакет для опенсурс-а, и тут для drag-and-drop нужен ajax, это 10000%

    я попытался разобраться в mptt, а вернее сказать как он сохраняет данные и по какому алгоритму. вот к чему я пришел:

    1. mptt создает таблицу для модель ее типа:

    поле parent_id показывает родителя, если null то корневой, если не null то id родителя
    поле mptt_level показывает глубину по горизонтале НО не показывает кто именно родитель
    поле tree_id , вот ту интереснее, как я понял если mptt_level равно 0 то tree_id это порядок по вертикали а если mptt_level не равно 0 показывает на родителя НО опять есть нюансы

    главная инфа в mptt дереве находится в полях lft, rght, tree_id

    пока вот это.

    в принципе думаю что понятно что я хочу замутить.

      Илья Чичак
      • 17 октября 2020 г. 18:02

      ну я бы не стал ломать голову и сделал бы какое-нибудь json api. а в него с фронта все передавал бы то, что там делается.

      мне кажется, пытаться это сделать средствами статического рендеринга django - непоравдано по сложности

        Nomad
        • 17 октября 2020 г. 19:29

        то есть, под json api вы имеите в виду что:

        на фронте, используя js или какой то js библиотекой (на пример www.jstree.com) которое уже знает про ajax строить дерево а уже гатовое дерево переводить в json и передавать бэку ?

        тогда мне не понятно как к каждому элементу дерева присвоить какой то контент?

          Илья Чичак
          • 17 октября 2020 г. 21:07
          • (ред.)

          не совсем.
          делается несколько ендпоинтов api, оди про саму структуру, второй про контент.

          на фронте делается следующее: при создании нового узла дерева - post запрос в апи с указанием id родителя и названием, вернуть id созданного узла. если родителя нет - значит это корневой узел. при создании контента к узлу - post запрос в апи с указанием id узла и собственно содержимого, вернуть id обьекта созданного контента. при обновлении - put запрос, при удалении - delete запрос.при этом контент может быть сложнее, чем просто текст

            Nomad
            • 19 октября 2020 г. 14:43
            • (ред.)

            у меня тут идет привязка: элемент дерева <-> контент = один к одному

            вы советуете 2 ендпоинта, по одному на каждую сторону, которые как бы будут автономны??

            или же можно сделать один ендпоинт и в этом случаеа фронт будет строить большой жсон для отправки бэку в котором будут оби стороны ??

            просто, из за неопытности в данной теме, мне немного не понайтно как будут потом синхронизироватся связь между: элемент дерева <-> контент

              Илья Чичак
              • 19 октября 2020 г. 21:43

              1 эндпоинт - элементы дерева, второй - контент. не надо мешать все в кучу.

              добавился элемент дерева - запрос в первый эндпоинт, вернулся id созданного элемента, и когда создается контент, отарвляется запрос на второй эндпоинт с указанием - для элемента с таким-то id был создан такой-то контент.

              собирать большой JSON на фронте не удобно - надо придумывать, когда его отправлять, нужна сложная валидация, нужно предусмотреть возможность обновить страницу пользователем и потерять все изменения, что плохо.

              а так все очень просто - каждое изменение фиксируется и сама обработка запроса неприлично простая

                Комментарии

                Только авторизованные пользователи могут публиковать комментарии.
                Пожалуйста, авторизуйтесь или зарегистрируйтесь
                Ua

                Qt - Тест 001. Сигналы и слоты

                • Результат:84баллов,
                • Очки рейтинга4
                Ua

                Qt - Тест 001. Сигналы и слоты

                • Результат:42баллов,
                • Очки рейтинга-8
                ОК

                Qt - Тест 001. Сигналы и слоты

                • Результат:47баллов,
                • Очки рейтинга-6
                Последние комментарии
                ИМ
                Игорь Максимов22 ноября 2024 г. 21:51
                Django - Урок 017. Кастомизированная страница авторизации на Django Добрый вечер Евгений! Я сделал себе авторизацию аналогичную вашей, все работает, кроме возврата к предидущей странице. Редеректит всегда на главную, хотя в логах сервера вижу запросы на правильн…
                Evgenii Legotckoi
                Evgenii Legotckoi31 октября 2024 г. 23:37
                Django - Урок 064. Как написать расширение для Python Markdown Добрый день. Да, можно. Либо через такие же плагины, либо с постобработкой через python библиотеку Beautiful Soup
                A
                ALO1ZE19 октября 2024 г. 17:19
                Читалка fb3-файлов на Qt Creator Подскажите как это запустить? Я не шарю в программировании и кодинге. Скачал и установаил Qt, но куча ошибок выдается и не запустить. А очень надо fb3 переконвертировать в html
                ИМ
                Игорь Максимов5 октября 2024 г. 16:51
                Django - Урок 064. Как написать расширение для Python Markdown Приветствую Евгений! У меня вопрос. Можно ли вставлять свои классы в разметку редактора markdown? Допустим имея стандартную разметку: <ul> <li></li> <li></l…
                d
                dblas55 июля 2024 г. 20:02
                QML - Урок 016. База данных SQLite и работа с ней в QML Qt Здравствуйте, возникает такая проблема (я новичок): ApplicationWindow неизвестный элемент. (М300) для TextField и Button аналогично. Могу предположить, что из-за более новой верси…
                Сейчас обсуждают на форуме
                f
                firstlunoxod15 февраля 2025 г. 13:46
                Рисование на QGraphicsScene при зажатой кнопке мыши Подскажите, пожалуйста! Как данный класс можно дополнить, чтобы созданные объекты можно было перемещать мышкой по сцене?
                Дмитрий
                Дмитрий3 февраля 2025 г. 16:24
                Создание deb-пакета. Как создать ярлык на рабочем столе после установки собственного deb-пакета? Всем привет. Сделал свой deb-пакет с программой. Всё устанавливается и работает. Ставлю по пути /usr/bin/my_application. Как для пользователя при установке пакета сразу создать ярлык на раб…
                NW
                Nayo Wai30 января 2025 г. 19:22
                не запускается компьютер!!! Не запускается компьютер (точнее работает блок , но сам монитор вообще жесть)В общем я ничего с интернета не скачивала в последнее время. На компе никаких левых пр…
                n
                nkly3 января 2025 г. 12:52
                Нужно запретить перемещение только некоторых итемов, остальные перемещать можно. Вопрос решен. Узнать QModelIndex элемента на который мы перетаскиваем другой элемент, можно с помощью функции indexAt(event->position().toPoint()) представления QTreeViev вызываемой в переопр…
                M
                Marsel17 августа 2023 г. 0:26
                OAuth2.0 через VK, получение email Спасибо большое за помощь и простите за то что отнял время своей невнимательностью.

                Следите за нами в социальных сетях