Как реализовать выпадающие списки страна-регион-город в Django Admin?

from django.db import models

class Country(models.Model):
    """
    Модель для представления страны.
    """
    name: str = models.CharField(max_length=100, unique=True)

    class Meta:
        verbose_name: str = "Страна"
        verbose_name_plural: str = "Страны"
        ordering: tuple[str, ...] = ('name',)

    def __str__(self) -> str:
        return self.name

class Region(models.Model):
    """
    Модель для представления региона (штата, области) в стране.
    """
    country: Country = models.ForeignKey(
        Country,
        on_delete=models.CASCADE,
        related_name='regions',
        verbose_name="Страна"
    )
    name: str = models.CharField(max_length=100)

    class Meta:
        verbose_name: str = "Регион"
        verbose_name_plural: str = "Регионы"
        unique_together: tuple[tuple[str, str], ...] = (('country', 'name'),) # Уникальность региона в рамках страны
        ordering: tuple[str, ...] = ('country__name', 'name')

    def __str__(self) -> str:
        return f"{self.name} ({self.country.name})"

class City(models.Model):
    """
    Модель для представления города в регионе.
    """
    region: Region = models.ForeignKey(
        Region,
        on_delete=models.CASCADE,
        related_name='cities',
        verbose_name="Регион"
    )
    name: str = models.CharField(max_length=100)

    class Meta:
        verbose_name: str = "Город"
        verbose_name_plural: str = "Города"
        unique_together: tuple[tuple[str, str], ...] = (('region', 'name'),) # Уникальность города в рамках региона
        ordering: tuple[str, ...] = ('region__country__name', 'region__name', 'name')

    def __str__(self) -> str:
        return f"{self.name} ({self.region.name})"

python manage.py makemigrations
python manage.py migrate

from django.http import JsonResponse
from django.views import View
from django.shortcuts import get_object_or_404
from .models import Country, Region, City

class GetRegionsView(View):
    """
    Представление для получения списка регионов по ID страны.
    """
    def get(self, request, *args, **kwargs) -> JsonResponse:
        country_id: str | None = request.GET.get('country_id')
        regions_list: list[dict[str, str | int]] = []

        if country_id:
            try:
                country: Country = get_object_or_404(Country, id=country_id)
                regions: list[Region] = country.regions.all().order_by('name')
                # Формируем список словарей для JsonResponse
                regions_list = [{'id': region.id, 'name': region.name} for region in regions]
            except ValueError: # Обработка некорректного country_id
                pass

        # Возвращаем JsonResponse. safe=False разрешает сериализацию списка.
        return JsonResponse(regions_list, safe=False)

class GetCitiesView(View):
    """
    Представление для получения списка городов по ID региона.
    """
    def get(self, request, *args, **kwargs) -> JsonResponse:
        region_id: str | None = request.GET.get('region_id')
        cities_list: list[dict[str, str | int]] = []

        if region_id:
            try:
                region: Region = get_object_or_404(Region, id=region_id)
                cities: list[City] = region.cities.all().order_by('name')
                # Формируем список словарей для JsonResponse
                cities_list = [{'id': city.id, 'name': city.name} for city in cities]
            except ValueError: # Обработка некорректного region_id
                pass

        return JsonResponse(cities_list, safe=False)

from django.urls import path
from .views import GetRegionsView, GetCitiesView

urlpatterns = [
    # ... другие URLы вашего приложения
    path('ajax/get_regions/', GetRegionsView.as_view(), name='ajax_get_regions'),
    path('ajax/get_cities/', GetCitiesView.as_view(), name='ajax_get_cities'),
]

// static/js/chained_dropdowns.js
document.addEventListener('DOMContentLoaded', function() {
    const countrySelect = document.getElementById('id_country'); // ID поля страны
    const regionSelect = document.getElementById('id_region');   // ID поля региона
    const citySelect = document.getElementById('id_city');     // ID поля города

    if (!countrySelect || !regionSelect || !citySelect) {
        // Если нужных полей нет на странице, прекращаем работу скрипта
        return;
    }

    // URLы для AJAX-запросов (замените на реальные, используя reverse или передачу из шаблона)
    // В админке ID элементов формы обычно id_
    const regionsUrl = '/ajax/get_regions/'; // Пример URL
    const citiesUrl = '/ajax/get_cities/';   // Пример URL

    /**
     * Отправляет AJAX запрос и заполняет выпадающий список.
     * @param {string} url - URL для запроса.
     * @param {string} parentId - ID родительского элемента (страны или региона).
     * @param {HTMLElement} targetSelect - Выпадающий список, который нужно обновить.
     * @param {string} defaultOptionText - Текст первой (пустой) опции списка.
     */
    function loadOptions(url, parentId, targetSelect, defaultOptionText) {
        // Очищаем список и добавляем опцию по умолчанию
        targetSelect.innerHTML = '';
        const defaultOption = document.createElement('option');
        defaultOption.value = '';
        defaultOption.textContent = defaultOptionText;
        targetSelect.appendChild(defaultOption);

        // Блокируем список до загрузки данных
        targetSelect.disabled = true;

        if (!parentId) {
            // Если родительский ID пуст, просто очищаем зависимые списки
            // (нужно вызвать loadOptions для следующих уровней с пустым parentId)
            if (targetSelect === regionSelect) {
                 loadOptions(citiesUrl, '', citySelect, '---------');
            }
            targetSelect.disabled = false;
            return;
        }

        // Выполняем AJAX запрос
        fetch(`${url}?${targetSelect === regionSelect ? 'country_id' : 'region_id'}=${parentId}`)
            .then(response => response.json())
            .then(data => {
                data.forEach(item => {
                    const option = document.createElement('option');
                    option.value = item.id;
                    option.textContent = item.name;
                    targetSelect.appendChild(option);
                });
                targetSelect.disabled = false; // Разблокируем список

                // Если это список регионов и есть выбранное значение в форме
                // (например, при редактировании объекта), пробуем его восстановить
                // Это упрощенный пример, для полного восстановления нужно больше логики
                // с отслеживанием исходных значений формы при загрузке.
            })
            .catch(error => {
                console.error('Error loading options:', error);
                targetSelect.disabled = false;
            });
    }

    // Обработчик изменения для выбора страны
    countrySelect.addEventListener('change', function() {
        const countryId = this.value;
        loadOptions(regionsUrl, countryId, regionSelect, '---------');
        // При изменении страны, список городов также должен быть очищен и заблокирован до выбора региона
        loadOptions(citiesUrl, '', citySelect, '---------');
    });

    // Обработчик изменения для выбора региона
    regionSelect.addEventListener('change', function() {
        const regionId = this.value;
        loadOptions(citiesUrl, regionId, citySelect, '---------');
    });

    // Инициализация при загрузке страницы (если форма редактируется и поля уже заполнены)
    // Если поля country и region уже имеют значения при загрузке страницы,
    // необходимо загрузить соответствующие зависимые списки.
    // Это требует более сложной логики, чтобы дождаться загрузки регионов,
    // прежде чем загружать города, и сохранить выбранные значения.
    // Простейшая инициализация: если выбрана страна, загрузить регионы.
    // Если выбран регион, загрузить города (при условии, что регионы уже загружены).
    // В реальном приложении лучше передавать исходные значения через шаблон или JS.

    if (countrySelect.value) {
         // При загрузке страницы, если выбрана страна, загрузить регионы
         // (Тут может потребоваться более умный подход, если уже выбран регион/город)
         // loadOptions(regionsUrl, countrySelect.value, regionSelect, '---------');
         // Для корректной инициализации при редактировании, возможно, потребуется
         // передать текущие selected_region_id и selected_city_id в JS и после загрузки
         // опций установить selectedIndex или value.
    }
});

from django.contrib import admin
from .models import Country, Region, City

@admin.register(Country)
class CountryAdmin(admin.ModelAdmin):
    list_display = ('name',)
    search_fields = ('name',)

@admin.register(Region)
class RegionAdmin(admin.ModelAdmin):
    list_display = ('name', 'country')
    list_filter = ('country',)
    search_fields = ('name', 'country__name')
    # Добавим raw_id_fields для крупных таблиц, если не хотим выпадающий список стран
    # raw_id_fields = ('country',)

@admin.register(City)
class CityAdmin(admin.ModelAdmin):
    list_display = ('name', 'region', 'country_display')
    list_filter = ('region__country', 'region') # Фильтр по стране и региону
    search_fields = ('name', 'region__name', 'region__country__name')
    # raw_id_fields = ('region',)

    # Добавляем метод для отображения страны в списке городов
    @admin.display(description='Страна')
    def country_display(self, obj: City) -> str:
        return obj.region.country.name if obj.region and obj.region.country else ''

# Пример использования в Inline
from django.contrib import admin
from django.contrib.auth.models import User
from .models import Address # Пример модели Address со связями Country, Region, City
from .forms import AddressAdminForm # Пользовательская форма для Address

class AddressInline(admin.StackedInline):
    model = Address
    form = AddressAdminForm # Используем нашу кастомную форму с Media классом
    extra = 1

# Допустим, у модели User есть связь one-to-many с Address
# class UserAdmin(admin.ModelAdmin):
#     inlines = [AddressInline,]
# admin.site.unregister(User) # Если User уже зарегистрирован
# admin.site.register(User, UserAdmin)

# forms.py в вашем приложении
from django import forms
from .models import Country, Region, City

class CityAdminForm(forms.ModelForm):
    """
    Пользовательская форма для модели City с подключением JS для каскадных списков.
    """
    # Можно добавить пустые поля в форму, если их нет в модели напрямую,
    # но в нашем случае поля country, region, city есть в связанных моделях.
    # Тут мы просто подключаем JS.

    class Meta:
        model = City
        fields = '__all__'

    class Media:
        # Путь к статическому файлу JS, относительно папки STATICFILES_DIRS или STATIC_ROOT
        js = (
            'admin/js/vendor/jquery/jquery.min.js', // Django Admin может использовать jQuery
            'admin/js/jquery.init.js',
            'js/chained_dropdowns.js', # Наш скрипт
        )
        # Если нужен CSS
        # css = {
        #     'all': ('css/my_admin.css',)
        # }

# Теперь используем эту форму в admin.py:
# @admin.register(City)
# class CityAdmin(admin.ModelAdmin):
#     form = CityAdminForm # Указываем нашу кастомную форму
#     # ... остальные настройки ...

# В вашем views.py
from django.views.decorators.cache import cache_page
from django.utils.decorators import method_decorator

# Кэшировать на 15 минут (900 секунд)
@method_decorator(cache_page(900), name='get')
class GetRegionsView(View):
    # ... остальной код класса ...

@method_decorator(cache_page(900), name='get')
class GetCitiesView(View):
    # ... остальной код класса ...