如何在Flask中创建连锁选择字段而无需刷新页面？

Question

我目前正在使用wtf编写一个地址表，其中包含国家、州、市等。数据库都是用FK设置的。

class Country(db.Model):
    __tablename__ = 'countries'
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(64), unique=True)
    users = db.relationship('User', backref='countries', lazy='dynamic')
class City(db.Model):
    __tablename__ = 'cities'
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(64), unique=True)
    countries_id = db.Column(db.Integer, db.ForeignKey('countries.id')) 

现在我试图实现链式selectfield排序效果，以优化用户体验。所需的效果是不离开或刷新页面，使selectfield根据上一个selectfield拉取数据。

例如，用户在Country中选择Australia，那么State的第二个selectfield应该只包含Australia中的states。

我对这个问题做了一些研究，但没有一个令人满意的解决方案。以下是我发现的两个可能但不令人满意的解决方案。

1.使用jQuery插件，例如Chained。但是，这个插件需要逐行编码。如果我采用这种解决方案，至少还有400多条线，这不是很Python。例如：

<select id="series" name="series">
  <option value="">--</option>
  <option value="series-3" class="bmw">3 series</option>
  <option value="series-5" class="bmw">5 series</option>
  <option value="series-6" class="bmw">6 series</option>
  <option value="a3" class="audi">A3</option>
  <option value="a4" class="audi">A4</option>
  <option value="a5" class="audi">A5</option>
</select>

2.使用Wtf的“带有动态选择值的选择字段”，这也是不可取的，因为它只根据前一个selectfield的默认值提取一次数据。例如：如果country的默认selectfield是Australia，那么state selectfield将只包含Australia内的states。当您将country selectfield改为America时，state selectfield仍然只包含澳大利亚境内的州。以下是wtf文档中列出的此方法的教程：

class UserDetails(Form):
    group_id = SelectField(u'Group', coerce=int)

def edit_user(request, id):
    user = User.query.get(id)
    form = UserDetails(request.POST, obj=user)
    form.group_id.choices = [(g.id, g.name) for g in Group.query.order_by('name')]

从上面的研究中，我假设令人满意的解决方案应该介于两者之间，并且它肯定应该包含一些Javascript来监视客户端活动，而不向服务器发送请求。有没有人有一个令人满意的解决方案的烧瓶框架？