如何使用bootstrap_flask中的render_form_row来创建一个水平的搜索框?

我想通过bootstrap_flask中的render_form_rowchrome创建一个类似那样的水平搜索框,但是我不知道要如何把StringField与SubmitField水平对齐,想问下有没有大佬知道怎么改?
我的部分代码如下:
app.py:

class Login2(FlaskForm):
    search = StringField()
    submit = SubmitField('Submit')

@app.route('/')
def index():
    form = Login2()
    return render_template('index.html', form=form)

index.html

{% extends "base.html" %}
{% from 'bootstrap/nav.html' import render_nav_item %}
{% from 'bootstrap/form.html' import render_form_row %}

{% block content %}
<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="navbar-nav mr-auto">
        {{ render_nav_item('index', 'Home') }}
    </div>
</nav>

<div style="margin: 100px">
    <h3>render_form_row example</h3>
    <form method="post">
        {{ form.csrf_token() }}
        {{ render_form_row([form.search, form.submit] , col_map={'search': 'col-md-6'}) }}
    </form>
</div>
{% endblock %}

(本人flask和web都是新手,请多多包涵,谢谢!)


这是以上代码对应的结果(即按钮未对齐的搜索框)(不好意思提问里忘记加了)

试了一下,这里需要 inline 表单才行,不过 render_form_row 目前还不支持传递 form_type 参数(下一个版本会添加)。目前你可以先手动写这些 Bootstrap 代码(文档)。

1 Like

好的,谢谢大佬!我去尝试一下