如何使用 flask-admin 更改输入字段大小

Question

经过长时间研究flask-admin和wtforms的文档和源代码，我仍然无法理解如何在flask-admin模型表单中改变输入字段的大小。

根据 wtf "crash course" 页面，应该可以在模板中向表单字段传递 css 参数，如下所示（jinja2 示例）：

<form method="POST" action="/login">
    <div>{{ form.username.label }}: {{ form.username(size="10") }}</div>
    <div>{{ form.password.label }}: {{ form.password() }}</div>
</form>

然而，对于 Flask-Admin 表单字段/模板，这似乎是不可能的。至少我还没有找到一个像样的方法来做到这一点

如有任何建议，我们将不胜感激

Answer 1

如果您要从 flask.ext.admin.contrib.sqla 扩展 ModelView class，您可以覆盖所用模板的值。您可以覆盖模型的列表视图、创建视图或编辑视图，如下所示：

class CustomAdminView(ModelView):
    list_template = "list_template.html"
    edit_template = "edit_template.html"
    create_template = "create_template.html"
    ...

您需要自己创建每个模板，并且可以扩展默认管理模板以使其与所有定制的管理视图保持一致。因此，示例模板为：

<style type="text/css">
    .select2-container, .select2-container-active, #title, #author, #description {
        width: 75% !important;
    }
    .controls div input {
        height: 40px;
    }
    .select2-search-choice {
        width: 90%;
    }
    #visible {
        float: left;
        text-align: left;
    }
</style>
{% extends 'admin/model/edit.html' %}

注意最后一行：{% extends 'admin/model/edit.html' %}，它扩展了 Flask Admin 的默认编辑视图。您可以将 edit 更改为 list 或 create 以扩展这些视图。

希望事情已经解决了。

Answer 2

一个选项是在模型视图中使用 form_widget_args，这是一个包含模型表单字段属性的字典。

例如，要为 'MyItem' 模型的 'description' 字段的文本区域设置 20 行：

class MyItemView(ModelView):
    form_widget_args = {
        'description': {
            'rows': 20
        }
    }

见http://flask-admin.readthedocs.org/en/latest/api/mod_model/

也可以通过指定 form_overrides 完全替换输入字段。例如，用单行输入字段替换文本区域：

class MyItemView(ModelView):
    form_overrides = {
        'description': StringField,
    }

见http://flask-admin.readthedocs.org/en/latest/advanced/， http://wtforms.readthedocs.org/en/latest/fields.html

如何使用 flask-admin 更改输入字段大小

how to change input field size with flask-admin

flask-admin