Flask-WTF uses input = submit instead of type = submit button

Question

I would like Flask "SubmitField" to use

<button type="submit" title="Save this form"><span>Save</span></button> 

Instead:

 <input type="submit" title="Save this form" /> 

I print it in templates:

 {{ field(class=css_class, title=field.description, **kwargs) }} 

I assume that I need to somehow modify SubmitInput (the widget behind SubmitField), but I'm not sure how to do this, do I need to change __html __ () somehow?

EDIT:

 from flask.ext.wtf import Required, Length, EqualTo, Field, TextInput from flask import Markup class InlineButtonWidget(object): html = """ <button type="submit" title="%s"><span>%s</span></button> """ def __init__(self, input_type='submit'): self.input_type = input_type def __call__(self, field, **kwargs): kwargs.setdefault('id', field.id) kwargs.setdefault('type', self.input_type) if 'value' not in kwargs: kwargs['value'] = field._value() return HTMLString(self.html % (field.name, field.label )) class InlineButton(Field): widget = InlineButtonWidget() def _value(self): if self.data: return u', '.join(self.data) else: return u'' class SignupForm(Form): name = TextField('Name', [Length(min=1, max=200)]) submit = InlineButton('sign up') 

I want to be able to do this:

submit = InlineButton ({'name': 'submit', 'title': 'Register today for the prizes.', 'type': 'submitfieldtype', 'textInsideSpan': 'Save current work'})

Answer 1

its easy, you can create a new widget such as InlineButtonWidget (), but I think it’s better to remove the submit from the form and use it in the template

 <button type="submit" title="Save this form"><span>Save</span></button> 

of cource you can also work with this:

 {% for name, label in buttons %} <button type="submit" title="{{name}}"><span>{{name}}</span></button> {% endfor %} 

sample widget:

 class InlineButtonWidget(object): html = """ <button type="submit" title="%s"><span>%s</span></button> """ def __init__(self, input_type='submit'): self.input_type = input_type def __call__(self, field, **kwargs): kwargs.setdefault('id', field.id) kwargs.setdefault('type', self.input_type) if 'value' not in kwargs: kwargs['value'] = field._value() return HTMLString(self.html % (field.name, field.lable )) 

Answer 2

The following implementation is more general.

 from wtforms.widgets.core import html_params from wtforms.widgets import HTMLString class InlineButtonWidget(object): """ Render a basic ``<button>`` field. """ input_type = 'submit' html_params = staticmethod(html_params) def __call__(self, field, **kwargs): kwargs.setdefault('id', field.id) kwargs.setdefault('type', self.input_type) kwargs.setdefault('value', field.label.text) return HTMLString('<button %s>' % self.html_params(name=field.name, **kwargs)) class InlineSubmitField(BooleanField): """ Represents an ``<button type="submit">``. This allows checking if a given submit button has been pressed. """ widget = InlineButtonWidget() class SignupForm(Form): name = TextField('Name', [Length(min=1, max=200)]) submit = InlineSubmitField('sign up')