Доброго времени суток. Подскажите, пожалуйста, что я делаю не так? Нужно сделать зависимый выпадающий список. Похожую задачу я делал, когда нужно было сделать зависимый список в форме, теперь тоже самое нужно сделать для поиска по сайту. Скрипт уже готов, только нужно переделать кое-что, но никак не могу понять, как это правильно сделать. Если не трудно, посмотрите, пожалуйста:
class Region(models.Model):
name = models.CharField(max_length=100, verbose_name='Название области')
def __str__(self):
return self.name
class City(models.Model):
region = models.ForeignKey(Region, on_delete=models.CASCADE, verbose_name='Область')
name = models.CharField(max_length=100, verbose_name='Название города')
def __str__(self):
return self.name
class District(models.Model):
city = models.ForeignKey(City, on_delete=models.CASCADE, verbose_name='Город')
name = models.CharField(max_length=100, verbose_name='Название района')
def __str__(self):
return self.name
views.py
def search(request):
districts = District.objects.all()
cities = City.objects.all()
regions = Region.objects.all()
queryset_list = Listing.objects.order_by('-list_date')
if 'region' in request.GET:
region_id = request.GET.get('region')
cities = City.objects.filter(region_id=region_id).order_by('name')
if region_id:
queryset_list = queryset_list.filter(region_id=region_id)
if 'city' in request.GET:
city_id = request.GET.get('city')
districts = District.objects.filter(city_id=city_id).order_by('name')
if city_id:
queryset_list = queryset_list.filter(city_id=city_id)
if 'district' in request.GET:
district_id = request.GET.get('district')
if district_id:
queryset_list = queryset_list.filter(district_id=district_id)
context = {
'districts': districts,
'cities': cities,
'regions': regions,
'listings': queryset_list,
'values': request.GET
}
return render(request, 'listings/search.html', context)
Шаблон:
<form action="{% url 'search' %}" id="search" data-search-url="{% url 'search' %}">
<div class="form-row">
<div class="col-md-3 mb-3">
<label class="sr-only">Область</label>
<select name="region" class="form-control" id="id_region">
<option selected="true" disabled="disabled">Область</option>
{% for region in regions %}
<option value="{{ region.pk }}">{{ region.name }}</option>
{% endfor %}
</select>
</div>
<div class="col-md-3 mb-3">
<label class="sr-only">Город</label>
<select name="city" class="form-control" id="id_city">
<option selected="true" disabled="disabled">Город</option>
{% for city in cities %}
<option value="{{ city.pk }}">{{ city.name }}</option>
{% endfor %}
</select>
</div>
<div class="col-md-3 mb-3">
<label class="sr-only">Район</label>
<select name="district" class="form-control" id="id_district">
<option selected="true" disabled="disabled">Район</option>
{% for district in districts %}
<option value="{{ district.pk }}">{{ district.name }}</option>
{% endfor %}
</select>
</div>
</div>
</form>
Скрипт:
$("#id_region").change(function () {
var url = $("#search").attr("search");
var regionId = $(this).val();
$.ajax({
url: url,
data: {
'region': regionId
},
success: function (data) {
$("#id_city").html(data);
}
});
});
$("#id_city").change(function () {
var url = $("#search").attr("search");
var cityId = $(this).val();
$.ajax({
url: url,
data: {
'city': cityId
},
success: function (data) {
$("#id_district").html(data);
}
});
});
urls.py
path('search', views.search, name='search'),
Может, нужно для области, города и района отдельную функцию сделать, но тогда в шаблоне как это правильно сделать? Мне же нужно одна кнопака поиска, одна форма для поиска. В общем, хотя бы пример, какой-нибудь, если есть, покажите пожалуйста, ибо пока в делах JS новичок.
