我有一个country组合框和一个trip组合框。两人都是雇员。它们使用数据库的同一个表（我不想使用两个表与foreignkey）。我想我已经接近解决方案了，但有些东西不起作用。第一个combobox被正确填充，而第二个combobox是空的（你可以在我的图片中看到）。
x1c 0d1x的数据
例如，如果我在Country中选择Spain，在combobox trip中我应该看到：Madrid-Barcelona，然后是Sevilla-Bilbao，因为它们在同一个数据库表中：
ID | COUNTRY | DEPARTURE | DESTINATION |
| france | paris | lyon |
| france | marseilles| grenoble |
| spain | madrid | barcelona |
| spain | seville | bilbao |字符串
models.py
from django.db import models
class Trip(models.Model):
country = models.CharField(max_length=100)
departure = models.CharField(max_length=100)
destination = models.CharField(max_length=100)
@property
def journey(self):
return f"{self.departure}-{self.destination}"型
url.py
from django.urls import path
from . import views
urlpatterns = [
path('', views.trip_selector, name="trip_selector"),
path('', views.trips, name='trips')
]型
表单.html
{% extends 'base.html' %}
{% block content %}
<!-- First Combobox -->
<label for="id_country">Country</label>
<select name="country" id="id_country"
hx-get="{% url 'trips' %}"
hx-target="#id_trip"
hx-indicator=".htmx-indicator">
{% for country in countries %}
<option value="{{ country }}">{{ country }}</option>
{% endfor %}
</select>
<!-- Second Combobox ??????? (non lo so)-->
<label for="id_trip">Trip</label>
{% include "trips.html" %}
{% endblock %}型
trips.html
<!-- Second Combobox -->
<select name="trips" id="id_trip">
{% for trip in trips %}
<option value="{{ trip.id }}">{{ trip.departure }}-{{ trip.destination }}</option>
{% endfor %}
</select>型
views.py
from django.shortcuts import render
from .models import Trip
def trip_selector(request):
...
countries = Trip.objects.values_list('country', flat=True).distinct()
trips = [] # no trips to start with
return render(request, 'form.html', {"countries": countries, "trips": trips})
def trips(request):
country = request.GET.get('country')
trips = Trip.objects.filter(country=country)
return render(request, 'trips.html', {"trips": trips})型
为了使问题完整，如果您想测试代码，那么我也粘贴代码base.html
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>University</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<!-- jQuery and Bootstrap CSS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<!-- Bootstrap Icons -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css">
<!-- HTMX -->
<script src="https://unpkg.com/htmx.org@1.6.0"></script>
</head>
<body>
<div class="container mt-4">
{% block content %}
{% endblock %}
</div>
</body>
</html>型
我希望有人能帮助我。谢谢大家！！！
1条答案
按热度按时间wlzqhblo1#
当你返回第二个选择框内容时，你只需要返回选项列表。目前你包括选择标记，我猜这是导致问题。
尝试从
trips.html中删除select标记，并将其移动到include块之外，如下所示。字符串