Multiple forms in a single page using flask and WTForms in which one form link to another

Question

This is what it looks like now:

This is what I need

• I need two forms one linking to another in a same page.
• On the first form: there will be an entry box for the user to fill out.
• If the entry is valid the system should lead the user to second form.
• The form would print out the result the system find and ask the user to enter a number into the entry box.
• The system will see if the entry is valid. If it is it will do a seires of action()

(words in bold are the part that works)

My code:

main function

@app.route("/searchArea", methods=['GET', 'POST'])
@login_required
def searchArea():
  if current_user.is_authenticated and verifyIdentity(current_user.username)==True:
    form1 = FindArea()
    form2 = SelectUser()
    if form1.submit1.data and form1.validate(): 
      allMatch = User.query.filter_by(area=form1.area1.data).all()
      
      if(allMatch == []):
        flash('area code does not exist', 'danger')
        return redirect(url_for('searchArea'))
      if form2.submit2.data and form2.validate(): #######
        user_select = int(form2.area.data)
        if(user_select>0 or user_select<=len(allMatch)):
          user= allMatch[user_select-1]
          author_name = user.username
          posts = Post.query.filter_by(author=author_name).all()
          emty_list = []
          while(len(posts)!= emty_list):
            db.session.delete(posts[0])
          db.session.delete(user)
          db.session.commit()
          return redirect(url_for('home'))
          flash('change have been made successfully', 'success')
          #return redirect(url_for('deleteUser',user=allMatch[user_select]))
        else:
          return redirect(url_for('searchArea'))
          flash('check your entry', 'danger')#######
      return render_template('print_area.html', title='Account',users=allMatch,form=form2)
    return render_template('searchArea.html', title='Account',form=form1)

forms.py

class FindArea(FlaskForm):
  area1=TextAreaField('Area Code', validators=[DataRequired()])
  submit1 = SubmitField('Search')
class SelectUser(FlaskForm):
  area2=TextAreaField('user number', validators=[DataRequired()])
  submit2 = SubmitField('confirm')

template(searchArea.html)

{% extends "layout.html"%} {% block content %}
<div>
    <form method="POST" action="" enctype="multipart/form-data">
        {{ form.hidden_tag() }}


        <div class="form-group">
            {{ form.area1.label(class="form-control-label") }} {% if form.area1.errors %} {{ form.area1(class="form-control form-control-lg
            is-invalid") }}
            <div class="invalid-feedback">
                {% for error in form.area1.errors %}
                <span>{{ error }}</span>
                            {% endfor %}
                        </div>
                    {% else %}
                        {{ form.area1(class="form-control form-control-lg") }}
                    {% endif %}
                </div>
          
        
          {{ form.submit1(class="btn btn-outline-info") }}
      </form>
  </div>
{% endblock content %}

template(print_area.html)

{% extends "layout.html"%} {% block content %}
<div>
    <form method="POST" action="" enctype="multipart/form-data">
        {{ form.hidden_tag() }}


        <div class="form-group">
            {{ form.area.label(class="form-control-label") }} {% if form.area.errors %} {{ form.area(class="form-control form-control-lg
            is-invalid") }}
            <div class="invalid-feedback">
                {% for error in form.area.errors %}
                <span>{{ error }}</span>
                            {% endfor %}
                        </div>
                    {% else %}
                        {{ form.area(class="form-control form-control-lg") }}
                    {% endif %}
                </div>
          
        
          {{ form.submit(class="btn btn-outline-info") }}
      </form>
  </div>
{% endblock content %}

Any help would be awsome! Thanks!

Answer 1

When you click the submit button of form2, this condition(if form1.submit1.data and form1.validate():) is False.Maybe you need to change the code logic.