3

I have a form with these two values (ndb is the Google App Engine ndb model):

model:

class Appointment(model.Base):
    start_time = ndb.DateTimeProperty(required=True)
    end_time = ndb.DateTimeProperty(required=True)

form (using wtforms):

class AppointmentUpdateForm(wtf.Form):
    start_time = wtforms.DateField('Start at', [wtforms.validators.required()])
    end_time = wtforms.DateField('End at', [wtforms.validators.required()])

And in the jinja2 template I have:

  {{forms.date_field(form.start_time, format='%Y-%m-%d %H:%M:%S')}}
  {{forms.date_field(form.end_time)}}

I want to display the form inputs as time widget but it looks like a date field. I think wtforms has a date_time field but how can I implement that?

Nima
  • 1,470
  • 2
  • 17
  • 25

1 Answers1

6

If you want to display a datetime widget you need to create a custom widget. when defining the form pass the widget for it with your own widget

To the widget, take a look at this example:

https://github.com/dpgaspar/Flask-AppBuilder/blob/master/flask_appbuilder/fieldwidgets.py#L5

Then define the form like this:

class AppointmentUpdateForm(wtf.Form):
    start_time = wtforms.DateField('Start at', [wtforms.validators.required()], widget=DatePickerWidget())
    end_time = wtforms.DateField('End at', [wtforms.validators.required()], widget=DatePickerWidget())

Remember this is using bootstrap Datetime picker so you have to include the CSS and js.

dpgaspar
  • 1,193
  • 8
  • 10