使用Flask,Jinja2模板渲染可编辑表格,然后处理返回的表单数据 [英] Render an editable table using Flask, Jinja2 templates, then process the form data returned

查看:248
本文介绍了使用Flask,Jinja2模板渲染可编辑表格,然后处理返回的表单数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Flask和Jinja2,我需要制作一个具有多行的可编辑表.

I'm using Flask and Jinja2 and I need to make an editable table with multiple rows.

这是表格的样子:

这是用于此的HTML

And here's HTML for that:

<form action="/support/team-members-update" method="post">
<table>
  <tbody><tr>
    <th>Name</th>
    <th>Id</th>
    <th>Inbox Share</th>
  </tr>
  <tr>
    <td>Ben</td><td>55555</td><td><input type="text" name="share_55555" value="0"></td></tr>  <tr>
    <td>Steve</td><td>66666</td><td><input type="text" name="share_66666" value="1"></td></tr> <tr>
    <td>Harry</td><td>77777</td><td><input type="text" name="share_77777" value="1"></td></tr>  <tr>
    <td>Sally</td><td>88888</td><td><input type="text" name="share_88888" value="1"></td></tr></tbody></table>
  <button type="submit">Send</button>
</form>

我当前的实现是在Lua中,在这里我很难对一堆字符串进行编码,并手工将发布数据连接到本地Lua类型(很有趣!).如果需要的话,我也可以在Python中手动处理表单数据,但是我想那里可能有更好的解决方案.

My current implementation is in Lua, where I'm hard coding a bunch of strings and connecting up the post data to native Lua types by hand (fun!). If I have to, I can process the form data by hand in Python as well, but I imagine there's probably a better solution out there.

我对WTForms进行了一些探讨,但运气不佳,无法使其正常工作.

I have explored WTForms a bit, but haven't had much luck getting it to work correctly.

我确实找到了 FieldList ,但是似乎处理的是相同字段的列表,而不是具有相同确切字段的多行.

I did find FieldList, but that seems to deal with a list of the same field, not multiple rows with the same exact fields.

我还找到了 TableWidget ,但是该文档稀疏,我无法弄清楚如何实现它来确定它是否可以满足我的期望.

I also found TableWidget, but the documentation is sparse and I can't figure out how to implement it to know if that would do what I'm looking to do.

推荐答案

FieldList可以使用,您需要列出

FieldList will work, you need to make a list of a FormField. Specify your FormField like so:

class MemberForm(Form):
    name = StringField('name')
    member_id = StringField('member_id')
    inbox_share = IntegerField('inbox_share')
    # etc.

class TeamForm(Form):
    title = StringField('title')
    teammembers = FieldList(FormField(MemberForm))

然后,您可以像这样在视图函数中从数据库中创建表单:

Then you can create the forms from your database in a view function like so:

@app.route('/support/team-members-update', methods=['GET','POST'])
def update_team_members():
    teamform = TeamForm()
    teamform.title.data = "My Team" # change the field's data
    for member in DB.get('teammembers') # some database function to get a list of team members
        member_form = MemberForm()
        member_form.name = member.name # These fields don't use 'data'
        member_form.member_id = member.id
        member_form.inbox_share = member.share

        teamform.teammembers.append_entry(member_form)

    return render_template('edit-team.html', teamform = teamform)

然后在模板中,您可以在创建表行时遍历teammembers中的每个项目:

And then in the template, you can iterate over each item in teammembers as you create your table rows:

<html>
    <head>
        <title>Edit Team Members</title>
    </head>
    <body>
        <h1>Edit Team</h1>
        <div>
            <form action="" method="post" name="teamform">
                {{ teamform.hidden_tag() }}
                Team Title: {{ teamform.title }}<br>
                <div>
                    <table>
                        <tr>
                            <th> Name </th>
                            <th> ID </th>
                            <th> Inbox Share </th>
                        </tr>
                        {% for member in teamform.teammembers %}
                        <tr>
                            <td>{{ member.name }}</td>
                            <td>{{ member.member_id }}</td>
                            <td>{{ member.inbox_share }}</td>
                        </tr>
                        {% endfor %}
                    </table>
                </div>
                <p><input type="submit" name="edit" value="Send"></p>
            </form>
        </div>
    </body>
</html>

这篇关于使用Flask,Jinja2模板渲染可编辑表格,然后处理返回的表单数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆