Flask-admin create a button next to a text field

问题

I've made a simple form using Flask-admin that looks like the following. I'm now looking into creating a refresh button next to the API text field, but don't really now how to.

Is this called a widget or inline model? I haven't been able to find a button in WTForms either that I can use. Would appreciate any examples on this as I've been able to override textfields, but not place other elements next to it in a easy way.

class AdministratorView(sqla.ModelView): page_size = 10

column_searchable_list = (
    'username',
    'description'
)

column_list = (
    'username',
    'apikey',
    'description',
    'active'
)

column_exclude_list = list = (
    'apikey',
    'auth_type'
)

form_excluded_columns = (
    'auth_type',
    'photos'
)

column_labels = {
    'apikey': 'API Key'
}

form_widget_args = {
        'apikey':{
            'readonly':True
        }
}

form_create_rules = (
    rules.FieldSet(('username', 'password', 'description'), 'Personal'),
    rules.FieldSet(('roles', 'apikey', 'active'), 'Permission'),
)

form_edit_rules = (
    rules.FieldSet(('username', 'description'), 'Personal'),
    rules.FieldSet(('roles', 'apikey', 'active'), 'Permission'),
    rules.Header('Reset password'),
    rules.Field('new_password')
)

def get_create_form(self):
    form = self.scaffold_form()
    form.username = fields.StringField('Username', [validators.Required()])
    form.password = fields.PasswordField('Password', [validators.Required()])
    return form

def get_edit_form(self):
    form = self.scaffold_form()
    delattr(form, 'password')
    form.new_password = fields.PasswordField('New Password')
    return form

def on_model_change(self, form, model, is_created):
    if is_created is False:
        if form.new_password.data:
            model.password = generate_password_hash(form.new_password.data)

def is_accessible(self):
    if login.current_user.is_authenticated:
        return login.current_user.has_role('admin')

Edit: I'm able to add a new element such as a header/h1 adding a html file like this:

{% extends 'admin/model/edit.html' %} 
{% block body %} 
    <h1>My custom header</h1> 
    {{ super() }} 
{% endblock %}

However, I can't figure out how to make changes to particular fields in the rendered form. Looking at the edit.html all I can see is the following. How do I "get inside" the rendered_form and add my custom button?

{% block edit_form %}
    {{ lib.render_form(form, return_url, extra(), form_opts) }}
  {% endblock %}

回答1:

Just use the lib.render_form_fields function to render your normal fields and add the button where you want it. You can use render_form_fields with multiple fields so you don't need to rewrite the whole template. Here is a modified version of flask-admins layout_bootstrap3 example that places a button close to the name field:

{% extends 'admin/model/edit.html' %}

{% block brand %}
    <h2 id="brand">Edit {{ admin_view.name|capitalize }}</h2>
    <div class="clearfix"></div>
    <hr>
{% endblock %}

{% block body %}
  {% call lib.form_tag(form) %}
    <div class="row">
      <div class="col-xs-10">
        {{ lib.render_form_fields([form.name])}}
      </div>
      <div class="col-xs-2">
        <a href="#" class="btn btn-default">Testbutton</a>
      </div>
    </div>
    <div class="row">
      <div class="col-xs-10">
        {{ lib.render_form_fields([form.email])}}
      </div>
    </div>
    <div class="form-buttons">
      {{ lib.render_form_buttons(return_url) }}
    </div>
  {% endcall %}
{% endblock %}

回答2:

Use form_edit_rules on your custom view to add HTML using the rules.HTML rule.

eg:

form_edit_rules = (
    rules.FieldSet(('username', 'description'), 'Personal'),
    rules.FieldSet(('roles', 'apikey', 'active'), 'Permission'),
    rules.HTML('<button onclick="alert('hello')">Refresh</button>'),
    rules.Header('Reset password'),
    rules.Field('new_password')
)

来源：https://stackoverflow.com/questions/40765490/flask-admin-create-a-button-next-to-a-text-field

标签

python

flask-admin