多个复选框,一个提交按钮以多种形式

时间:2018-08-09 08:40:48

标签: python html flask flask-appbuilder

当前,我的Submit按钮仅位于一个对象上,这是因为它位于for循环之外,因此它将仅对底部文件进行计算。

但是,如果我将按钮放回循环中,它将为每一行放置一个提交按钮,但是它将无法对多个文件进行计算,所以我想知道如何为所有文件获得一个提交按钮文件,因此它将为每个文件(当前已检查的文件)进行计算

(之前搜索过该问题,以前回答的问题都没有帮助)

HTML文件(部分)

 {% for f in files %}
 <tr>
     <td>{{ f.key }}</td>
     <td>{{ f.last_modified | datetimeformat }}</td>
     <td>{{ f.key | file_type }}</td>
     <td>
         <form class="download-form" action="{{ url_for('myview.action') }}" method="POST">
             <input type="checkbox" name="key" value="{{ f.key }}">
{% endfor %}
             <button type="submit" name="submit" value="submit">Submit</button>
         </form>
     </td>
 </tr>

Python文件(部分)

@expose('/', methods=['POST', 'GET'])
@appbuilder.app.route('/', methods=['POST', 'GET'])
def action(self):

    my_bucket = get_bucket()
    s = my_bucket.objects.all()
    t = getmyobject()

    return render_template(
        'page.html',
        my_bucket=my_bucket,
        base_template=appbuilder.base_template,
        appbuilder=appbuilder,
        page=s, t=t
    )

2 个答案:

答案 0 :(得分:0)

如果您未将按钮放入表单中,而是在表格之后显示,如下所示:

{% for f in files %}
 <tr>
     <td>{{ f.key }}</td>
     <td>{{ f.last_modified | datetimeformat }}</td>
     <td>{{ f.key | file_type }}</td>
     <td>
          <input type="checkbox" name="key" value="{{ f.key }}">
     </td>
 </tr>
{% endfor %}
<button type="submit" name="submit" value="submit">Submit</button>

然后,您可以使用JS收集每个选中的输入字段的值并提交。

要提交,您将在按钮上使用onclick事件。

答案 1 :(得分:0)

您已经弄乱了表单和for循环,请尝试将for循环放入这样的form标记内,然后在form内添加按钮,然后关闭for循环。

 <form class="download-form" action="{{ url_for('myview.action') }}" method="POST">
     {% for f in files %}
         <tr>
             <td>{{ f.key }}</td>
             <td>{{ f.last_modified | datetimeformat }}</td>
             <td>{{ f.key | file_type }}</td>
             <td><input type="checkbox" name="key" value="{{ f.key }}"></td>
         </tr>
    {% endfor %}
    <button type="submit" name="submit" value="submit">Submit</button>
</form>

希望有帮助。