Несколько независимых экземпляров одной и той же формы формы на одной странице - PullRequest
Новая
       30

Несколько независимых экземпляров одной и той же формы формы на одной странице

0 голосов
/ 21 декабря 2018

Я играю с приложением для управления проектами.Я зацикливаю проекты, списки в сторонних проектах и ​​задачи внутри каждого списка.Я хотел бы, чтобы форма CreateTask () появлялась для каждого списка под задачами, и это так.

Причина в том, что у меня есть 2 скрытых поля, идентификатор проекта и идентификатор списка.

Проблема в том, что, хотя формы отображаются правильно, если я ввожу имя задачи и отправляю, все, что он делает, это обновляет страницу, и каждая форма содержит текст, который я ввел в первую форму.

Как я могу использовать одну и ту же форму WTForms в нескольких экземплярах на одной странице и заставить их работать независимо?

Работает одна форма с идентификатором проекта и списка для выбора полей.Я могу добавлять задачи.

from flask import Flask, render_template, request, redirect, url_for
from flask_sqlalchemy import SQLAlchemy
from flask_wtf import FlaskForm
from wtforms import StringField, SelectField, TextAreaField, SubmitField, HiddenField
from wtforms.validators import DataRequired, Length, ValidationError

app = Flask(__name__)
app.config['SECRET_KEY'] = 'f0c4803ba453fc7f8d0c43df21413916'
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///site.db'
db = SQLAlchemy(app)

##################################
######    Database Tables   ######
##################################

class Project(db.Model):
  p_id = db.Column(db.Integer, primary_key=True)
  p_title = db.Column(db.String(300), nullable=False)
  p_list = db.relationship('List', backref="project", lazy=True)
  p_task = db.relationship('Task', backref="project", lazy=True)

  def __repr__(self):
    return f"P('p_id: {self.p_id}','p_title: {self.p_title}','p_list: {self.p_list}', 'p_task: {self.p_task}')" 

class List(db.Model):
  l_id = db.Column(db.Integer, primary_key=True)
  l_title = db.Column(db.String(300), nullable=False)
  l_project = db.Column(db.Integer, db.ForeignKey('project.p_id'), nullable=False)
  l_task = db.relationship('Task', backref="list", lazy=True)

  def __repr__(self):
    return f"L('l_id: {self.l_id}','l_title: {self.l_title}','l_project: {self.l_project}')"

class Task(db.Model):
  t_id = db.Column(db.Integer, primary_key=True)
  t_title = db.Column(db.Integer, nullable=False)
  t_list = db.Column(db.Integer, db.ForeignKey('list.l_id'), nullable=False)
  t_project = db.Column(db.Integer, db.ForeignKey('project.p_id'), nullable=False)

  def __repr__(self):
    return f"T('t_id: {self.t_id}',' t_title: {self.t_title}','t_project: {self.t_project}')"


##################################
#####         Forms         ######
##################################

class CreateTask(FlaskForm):
  project = HiddenField('Project:', validators=[DataRequired()])
  list_select = HiddenField('List:', validators=[DataRequired()])
  task_title = StringField('Task Title:', validators=[DataRequired()])
  submit = SubmitField('Add Task')

##################################
######        Run App       ######
##################################

@app.route('/try', methods=['GET', 'POST'])
def index():
  form = CreateTask(request.values, project="foo", fld2="bar")
  if form.validate_on_submit():
    p_id = form.project.data   
    l_id = form.list_select.data   
    task = form.task_title.data
    new_task = Task(t_project=p_id, t_list=l_id, t_title=task)
    db.session.add(new_task)
    db.session.commit()
  project = Project.query.all()
  return render_template('index.html', form=form, project=project)

if __name__ == "__main__":
  app.run(debug=True)




{% for item in project %}
  <div style="padding: 30px; maring: 30px; border: 1px solid #000;">
    <h2>{{ item.p_title }}</h2><br><hr><br>
    {% for item2 in item.p_list %}
      <h3>{{ item2.l_title }}</h3><br><hr><br>
      {% for item3 in item2.l_task %}
        <h4>{{ item3.t_title }}</h4><br><br>
      {% endfor %}
      <br><br>
      <div style="padding: 40px;">
        <form action="" method="POST">
          {{ form.hidden_tag() }}          
          {{ form.project(value=item.p_id) }}
          {{ form.list_select(value=item2.l_id) }}
          {{ form.task_title.label }}<br>
          {{ form.task_title }}<br><br>
          {{ form.submit }}
        </form>
      </div>
    {% endfor %}
  </div>
{% endfor %}

1 Ответ

0 голосов
/ 21 декабря 2018

Вы не создаете два экземпляра формы, вы просто визуализируете один и тот же экземпляр дважды.

Так что в app.py это должно быть: 

def index():
    form1 = CreateTask(request.values, project="foo", fld2="bar")
    form2 = CreateTask(request.values, project="foo", fld2="bar")
    ...
    return render_template('index.html', form1=form1, form2=form2, project=project)

И шаблон имеетбыть изменены соответствующим образом.Вы можете поместить два экземпляра в список, если хотите перебрать их в шаблоне.

Но учтите, что если у вас есть несколько форм на странице, будет отправлена ​​только одна форма.Если вы хотите редактировать несколько элементов одновременно, вам нужно итеративно сгенерировать одну форму (по крайней мере, если вы не добавите магию JS).

...