如何将 html <span> 添加到 SubmitField 文本参数？

Question

我正在尝试在提交按钮文本中包含一个信封符号。

基本上我要生成的代码是

<button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-envelope"></span> Envelope</button>

reference

但是我当然做不到

submit = SubmitField('<span class="glyphicon glyphicon-envelope"></span> Send')

执行此操作的最佳方法是什么？我正在尝试一些 javascript 代码，但我认为这不是最好的主意。

谢谢，

Answer 1

根据我对 wtforms 代码的阅读，通用 SubmitField 呈现一个 HTML 元素，如下所示：

<input type="submit" value="SOME TEXT LABEL">

之所以这样做是因为SubmitField有签名（可以追溯继承看到HTML生成代码）：

class SubmitField(BooleanField):
    """
    Represents an ``<input type="submit">``.  This allows checking if a given
    submit button has been pressed.
    """
    widget = widgets.SubmitInput()

要根据需要输出 HTML，您需要定义自定义小部件。查阅相关文档。

例如这样的东西（未经测试）可能有效：

class MySubmitWidget(widgets.SubmitInput): # note subclassing the original
    def __call__(self, field, **kwargs):  # but overriding the render
        return HTMLString('<button type="button" class="btn btn-primary"><span class="glyphicon glyphicon-envelope"></span> Envelope</button>')

class MySubmitField(SubmitField): # note subclassing the original
    widget = MySubmitWidget # but overriding the render widget

而在您的表单中，您只需使用 MySubmitField 即可。如果您想进一步自定义或使 HTML 动态，您必须修改 __call__() 方法以生成 HTML 以响应 kwargs。

请注意，但是 <input type="submit"> 元素有一个特定的默认操作，即提交表单，当您呈现通用 <button> 它不会自动提交您的表单，因此您很可能必须接下来解决这个问题。

Answer 2

试试这个 -

在表单定义中，为提交字段提及此内容。

submit = SubmitField('☉')

如何将 html <span> 添加到 SubmitField 文本参数？

How to add a html <span> to the SubmitField text argument?

flask

flask-wtforms