Flask-WTF : 제출시 동일한 데이터를 모두 반환하는 동일한 클래스의 여러 형식

Question

이미지 당 하나씩 여러 개의 양식을 생성하고 이미지 및 해당 양식을 목록의 튜플로 패키징합니다.

이 목록은 Jinja로 전달되어 각 튜플이 압축 해제되고 각 이미지와 양식이 양식을 통해 투표하기위한 목록에 삽입됩니다.

내 문제는 특정 양식을 클릭하면 모든 양식이 해당 버튼을 클릭 한 것처럼 돌아가는 것입니다.

그래서 실제로 위 또는 아래로 투표 한 이미지는 해당 버튼이 다른 모든 이미지에 대해 클릭 된 것처럼 작동합니다.

양식 인쇄를 시도하고 콘솔에 데이터를 반환 할 때 합법적 인 양식을 만들고 있음을 알고 있습니다. 이 작업을 수행 할 때 각 양식에는 고유 한 주소가 있으며 모든 양식은 form.field.data 속성에 동일한 데이터 (True/False)를 표시합니다. 누군가 여기서 일어나는 일을 발견하도록 도와 줄 수 있습니까?

형태 :

class VoteForm(FlaskForm): 
    upvote = SubmitField('vote up') 
    downvote = SubmitField('vote down') 

경로 :

@index_mod.route('/', methods = ['GET', 'POST']) 
def index(): 
    pics = Pic.select().order_by(Pic.score.desc()) 

    pics_and_forms = [] 

    for pic in pics: 
     voteform = VoteForm() 
     #tuple of pic and corresponding form 
     pics_and_forms.append((pic, voteform)) 

    for pic, form in pics_and_forms: 
     if form.validate_on_submit(): 
      if form.upvote.data: 
       pic.score += 1 
       pic.save() 
      if form.downvote.data: 
       pic.score -= 1 
       pic.save()    

    return render_template('index.html', pics_and_forms = pics_and_forms) 

진자 :

<ul> 
    {% for pic, form in pics_and_forms %} 
    <li> 
     <b>{{ pic.name }} </b> 
     <i>Submitted by {{ pic.user.username }}</i> 
     Score: {{ pic.score }} 
     <img src="/pic/get/{{ pic.uuid }}" style="width:128px;" > 

     <form method="post" action=" {{ url_for('index_mod.index') }}"> 
     {{ form.csrf_token }} 
     {{ form.upvote }} 
     {{ form.downvote }} 
     </form> 

    </li> 
    {% endfor %} 
</ul> 

EDIT 그래서

나는 것을 알아내는거야 내가 돌아 오는 게시물 요청에서 클릭 한 특정 양식을 지정하지 않으려면 페이지에 여러 양식을 포함 할 수 있습니다.

대신 숨겨진 필드에 세부 정보를 포함시킨 다음 플라스크 요청 개체를 사용하여 숨겨진 양식에서 해당 필드를 검색 할 계획입니다.

나는 이것을 위해 Flask-WTF를 완전히 사용하고 싶지만 동적으로 여러 양식을 페이지에 추가하고 실제로 어떤 양식을 클릭했는지 검색하는 우아한 방법이없는 것처럼 보입니다.

Answer 1

한 번에 하나의 양식 만 제출하기 때문에 실제로 한 개의 Form 개체 만 처리하면됩니다. 더 나은 접근 방법은 투표중인 사진의 ID가 포함 된 URL로 POST하는 것이고 클릭/제출 투표는 클릭 한 제출 버튼에서 캡처 한 것입니다.

나는이 설명하는 코드 리팩토링했습니다

app.py을

from flask import Flask, render_template, redirect, url_for 
from flask_wtf import FlaskForm 
from wtforms import SubmitField 


app = Flask(__name__) 
app.secret_key = 'secret' 


class VoteForm(FlaskForm): 
    upvote = SubmitField('vote up') 
    downvote = SubmitField('vote down') 


@app.route("/", methods=['GET']) 
def index(): 

    form = VoteForm() 

    pics = [ 
     { 
      "name": "test", 
      "user": {"username": "test"}, 
      "score": 1, 
      "uuid": 'test' 
     }, 
     { 
      "name": "test2", 
      "user": {"username": "test"}, 
      "score": 2, 
      "uuid": 'test2' 
     } 
    ] 

    return render_template("index.html", form=form, pics=pics) 


@app.route("/pic/<id>/vote", methods=['POST']) 
def vote(id): 

    form = VoteForm() 

    if form.validate_on_submit(): 
     if form.upvote.data: 
      print("Upvote for pic {}".format(id)) 
     if form.downvote.data: 
      print("Downvote for pic {}".format(id)) 

    return redirect(url_for('index')) 


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

index.html을

<ul> 
    {% for pic in pics %} 
    <li> 
     <b>{{ pic.name }} </b> 
     <i>Submitted by {{ pic.user.username }}</i> 
     Score: {{ pic.score }} 
     <img src="/pic/get/{{ pic.uuid }}" style="width:128px;" > 

     <form method="post" action="{{ url_for('vote', id=pic['uuid']) }}"> 
     {{ form.csrf_token }} 
     {{ form.upvote }} 
     {{ form.downvote }} 
     </form> 

    </li> 
    {% endfor %} 
</ul>