Question

我有以下数据库模型：

class FlashcardCollection(db.Model):
    __tablename__ = 'flashcardcollection'
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(64), index=True)
    timestamp = db.Column(db.DateTime, index=True, default=datetime.utcnow)
    user_id = db.Column(db.Integer, db.ForeignKey('users.id'))
    flashcards = db.relationship('Flashcard', backref='collection', lazy='dynamic')
    categories = db.relationship('Category',
                             secondary=has_category,
                             backref=db.backref('collections', lazy='dynamic'),
                             lazy='dynamic')

class Category(db.Model):
    __tablename__ = 'category'
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(64), unique=True, index=True)

has_category = db.Table('has_category',
                    db.Column('category_id', db.Integer, db.ForeignKey('category.id')),
                    db.Column('flashcardcollection_id', db.Integer, db.ForeignKey('flashcardcollection.id')))

我有以下表格类：

class FlashcardCollectionForm(FlaskForm):
    name = StringField('Collection name', validators=[DataRequired()])
    category = SelectField('Category', choices=[])
    submit = SubmitField('Add')

使用此表单，我将添加一个新的Flashcard Collection。此外，我将允许用户在创建集合时为Flashcard集合添加新类别。

视图功能如下（现在没有做任何事情）

@main.route('/add-collection', methods=['GET', 'POST'])
@login_required
def add_collection():
   form = FlashcardCollectionForm()
   if form.validate_on_submit():
       flash('Flashcard Collection added.')
       return redirect(url_for('.index'))
   return render_template('add_collection.html', form=form)

在此视图中，将创建新的Flashcardcollection并将其添加到数据库中。

这是模板：

{% block page_content %}
    <div class="page-header">
        <h1>Add a new Flashcard Collection</h1>
    </div>
    <div class="col-md-4">

        <form action="#" method="post">
            {{ form.csrf_token }}
            {{ form.name.label }} {{ form.name(size=20) }}
            {{ form.category.label }} {{ form.category(id="test") }}
            <button>Add</button>
            <input type="submit" value="Go">
        </form>
    </div>
{% endblock %}

A单击“添加”按钮应提示用户输入新类别。然后应将此类别添加到数据库并显示在“选择字段”中。提交按钮上的CLick应该将Flashcard Collection添加到数据库中。

问题是第一部分。如何在创建新的Flashcard Collection时动态添加新类别？有没有Javascript的解决方案或我应该使用JavaScript。如果是，函数是怎么样的？

Answer 1

使用flask_sqlalchemy可以轻松创建模型并填充选择标记。接下来，将__init__方法添加到表单类以填充数据库中的值：

class FlashcardCollectionForm(FlaskForm):
    ...
    def __init__(self, *args, **kwargs):
        super(FlashcardCollectionForm, self).__init__(*args, **kwargs)
        self.category.choices = [(card.id)(card.category) for card in Card.query.all()]

使用__init__，我们为select字段设置选项全部来自数据库。最后，保存条目：

def add_collection():
   form = FlashcardCollectionForm()
   if request.method == 'POST':
       c = Category(name=form.name.data)
       f = FlashcardCollection(...)
       has_category(category_id=c.id, flashcardcollection_id=f.id)
       db.session.add_all([c, f])
       db.session.commit()

添加Select Field Flask WTForms的条目

1 个答案: