Question

有没有办法从Flask功能启动弹出窗口？

我有flask-admin + flask-sqlalchemy个应用。数据库中的表包含具有某些值的字段foo。我有UserAdmin视图，我正在尝试使用一些外部参数创建batch action。我想：

从我的数据库和
使用一个新的用户定义值替换每个元素的旧foo值，并
我想要接收这个新值的方式是一个模态窗口。

所以模型是：

class User(db.Model):
    # some code
    foo = Column(Integer)
    def change_foo(self, new_foo):
        self.foo = int(new_foo)
        db.session.commit()
        return True

class UserAdmin(sqla.ModelView):
    # some code
    @action('change_foo', 'Change foo', 'Are you sure you want to change foo for selected users?')
    def action_change_foo(self, ids):
        query = tools.get_query_for_ids(self.get_query(), self.model, ids)
        count = 0
        # TODO: pop-up modal window here to get new_foo_value
        # new_foo_value = ???
        for user in query.all():
            if user.change_foo(new_foo_value):
                count += 1
        flash(ngettext('Foo was successfully changed.',
                       '%(count)s foos were successfully changed.',
                       count, count=count))
    except Exception as e:
        flash(ngettext('Failed to change foo for selected users. %(error)s', error=str(e)), 'error')

我承认整个方法并不是最优的，所以我很高兴能得到更好的建议。

有一些相关的问题：«Batch Editing in Flask-Admin»（尚未答复）和«Flask-Admin batch action with form»（使用WTF表格进行一些解决方法）。

Answer 1

这是实现这一目标的一种方法。我已将完整的自包含示例放在Github上，flask-admin-modal。

更新于2018年5月28日.Github项目得到了另一位用户的强化，可以很好地处理表单验证。

在此示例中，SQLite数据库模型是具有名称（字符串）和成本（整数）属性的项目，我们将在Flask-Admin列表视图中更新所选行的成本值。请注意，Flask应用程序启动时，数据库中会填充随机数据。

这是模特：

class Project(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(255), nullable=False, unique=True)
    cost = db.Column(db.Integer(), nullable=False)

    def __str__(self):
        return unicode(self).encode('utf-8')

    def __unicode__(self):
        return "Name: {name}; Cost : {cost}".format(name=self.name, cost=self.cost)

使用整数成本字段定义一个表单，该表单接受新成本。此表单还有一个隐藏字段，用于跟踪选定的行ID。

class ChangeForm(Form):
    ids = HiddenField()
    cost = IntegerField(validators=[InputRequired()])

覆盖项目视图模型的列表模板。我们这样做，因此我们可以在changeModal内注入一个ID为{% block body %}的Bootstrap模式表单，确保我们先调用{{ super() }}。

我们还添加了一个jQuery文档就绪函数，如果模板变量（change_modal）的计算结果为true，它将显示模态形式。模态体中使用相同的变量来显示change_form。我们使用Flask-Admin lib宏render_form以Bootstrap样式呈现表单。

请注意render_form中action参数的值 - 它是我们在Project视图中定义的路径，我们可以在其中处理表单的数据。另请注意＆＃34;关闭＆＃34;按钮已被替换为链接，但仍设置为按钮。该链接是从中启动操作的原始URL（包括页面和过滤器详细信息）。

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

{% block body %}
    {{ super() }}

    <div class="modal fade" tabindex="-1" role="dialog" id="changeModal">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <a href="{{ url }}" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></a>
            <h4 class="modal-title">Change Project Costs</h4>
          </div>
          <div class="modal-body">
              {% if change_modal %}
                  {{ lib.render_form(change_form, action=url_for('project.update_view', url=url)) }}
              {% endif %}
          </div>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
{% endblock body %}

{% block tail %}
    {{ super() }}
    <script>
        {% if change_modal %}
            $(document).ready(function(){
                $("#changeModal").modal('show');
            });
        {% endif %}
    </script>
{% endblock tail %}

Project视图类需要修改批处理操作方法的行为，并定义一些接受POST请求的路由。

@action('change_cost', 'Change Cost', 'Are you sure you want to change Cost for selected projects?')
def action_change_cost(self, ids):
    url = get_redirect_target() or self.get_url('.index_view')
    return redirect(url, code=307)

批处理操作不是直接处理ID，而是获取发布操作的网址，此网址将包含任何页码和过滤器详细信息。然后，它使用307重新定向到列表视图。这可以确保选定的行ID在正文中传送，以及它是POST请求的事实。

定义POST路由以处理此重定向，从请求正文中获取id和url，实例为ChangeForm，将隐藏的ids表单字段设置为id的编码列表。将url，change_form和change_model变量添加到模板参数中，然后再次渲染列表视图 - 这次模式弹出窗体将显示在视图中。

@expose('/', methods=['POST'])
def index(self):
    if request.method == 'POST':
        url = get_redirect_target() or self.get_url('.index_view')
        ids = request.form.getlist('rowid')
        joined_ids = ','.join(ids)
        encoded_ids = base64.b64encode(joined_ids)
        change_form = ChangeForm()
        change_form.ids.data = encoded_ids
        self._template_args['url'] = url
        self._template_args['change_form'] = change_form
        self._template_args['change_modal'] = True
        return self.index_view()

定义POST路由以处理模态表单的数据。这是标准的表单/数据库处理，并在完成时重定向回到发起操作的原始URL。

@expose('/update/', methods=['POST'])
def update_view(self):
    if request.method == 'POST':
        url = get_redirect_target() or self.get_url('.index_view')
        change_form = ChangeForm(request.form)
        if change_form.validate():
            decoded_ids = base64.b64decode(change_form.ids.data)
            ids = decoded_ids.split(',')
            cost = change_form.cost.data
            _update_mappings = [{'id': rowid, 'cost': cost} for rowid in ids]
            db.session.bulk_update_mappings(Project, _update_mappings)
            db.session.commit()
            return redirect(url)
        else:
            # Form didn't validate
            # todo need to display the error message in the pop-up
            print change_form.errors
            return redirect(url, code=307)

通过弹出模式窗口参数的Flask-admin批处理操作

1 个答案: