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

Question

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

我有一个flask-admin+ flask-sqlalchemy应用程序.DB中的表包含foo具有某些值的字段.我有一个UserAdmin视图,我正在尝试使用一些外部参数创建批处理操作.即我想:

• 从我的DB中选择几个元素
• 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')

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

有一些相关的问题:« Flask-Admin中的批量编辑 »(尚未答复)和« Flask-Admin批量操作与表单 »(使用WTF表单的一些解决方法).

Answer 1

这是实现这一目标的一种方法.我把完整的自包含示例放在Github上,flask-admin-modal.

更新于2017年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()])

覆盖项目视图模型的列表模板.我们这样做,所以我们可以注入一个引导模式形式,通过一个ID changeModal,内{% block body %},确保我们称之为{{ super() }}第一.

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

请注意action参数的值render_form- 它是我们在Project视图中定义的路径,我们可以在其中处理表单的数据.另请注意,"关闭"按钮已替换为链接,但仍设置为按钮.该链接是启动操作的原始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,批处理操作获取发布操作的URL,此URL将包括任何页码和过滤器详细信息.然后,它使用307重定向回列表视图.这可确保选定的行ID在正文中携带,以及它是POST请求的事实.

定义POST路由以处理此重定向,从请求主体获取id和url,实例a 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)