带Flask，Flask-Admin和WTforms的DatePickerWidget

我想渲染一个包含DatePicker的模板，但是当我尝试时出现500错误。对于我的代码是正确的，但似乎有什么失败，或者我没有正确理解如何去做。带Flask，Flask-Admin和WTforms的DatePickerWidget

的代码如下：

Reporting.py

from flask.ext.admin import BaseView, expose 
from wtforms import DateField, Form 
from wtforms.validators import Required 
from flask.ext.admin.form import widgets 
from flask import request 

class DateRangeForm(Form): 
    start_date = DateField('Start', validators=[Required()], format = '%d/%m/%Y', description = 'Time that the event will occur', widget=widgets.DatePickerWidget) 

class ReportingView(BaseView): 
    @expose('/') 
    def index(self): 
     form = DateRangeForm(request.form) 
     return self.render('reporting.j2', form=form)

报告模板：

{% extends 'admin/master.html' %} 
{% block body %} 
    {{super()}} 
    Working on it! 

    {% if form %} 
     {{form.start_date}} 
    {% endif %} 
{% endblock %}

来源

2014-09-26 Pepeluis

你遇到了什么异常？ – dirn 2014-09-26 11:56:55

好的，我已经删除了“request.form”，因为它不是一个请求。现在它显示正确的一个字段，但没有dateTimePicker选择日期。只是一个字符串字段。 – Pepeluis 2014-09-26 13:30:34

DateField只提供日期字符串解析。如果你想要一些前端拾取器，你需要自己添加它。 – davidism 2014-09-26 14:58:47

由于davidism在评论中说，默认的DateField只是提供了日期解析，它只会显示为正常的文本输入。

如果你准备充分拥抱HTML5，那么你可以从wtforms.fields.html5使用的DateField这会使在任何支持的浏览器一个datepicker它：

from flask import Flask, render_template 
from flask_wtf import Form 
from wtforms.fields.html5 import DateField 
app = Flask(__name__) 
app.secret_key = 'SHH!' 


class ExampleForm(Form): 
    dt = DateField('DatePicker', format='%Y-%m-%d') 


@app.route('/', methods=['POST','GET']) 
def hello_world(): 
    form = ExampleForm() 
    if form.validate_on_submit(): 
     return form.dt.data.strftime('%Y-%m-%d') 
    return render_template('example.html', form=form) 


if __name__ == '__main__': 
    app.run(debug=True)

更通常的做法是找到一个不错的日期选择器在线，这是使用CSS和JS来处理它的显示，并将该代码包含到您的html模板中，并告诉它将日期选择器样式应用于任何类别为datepicker的html元素。然后，当你生成表单，你可以这样做：

<!-- all your CSS and JS code, including the stuff --> 
<!-- to handle the datepicker formatting --> 

<form action="#" method="post"> 
    {{ form.dt(class='datepicker') }} 
    {{ form.hidden_tag() }} 
    <input type="submit"/> 
</form>

所有属性（即不用于其他用途保留），你传递到渲染表单元素将默认只需将其添加为一个属性，例如{{ form.dt(class='datepicker') }}将生成<input class="datepicker" id="dt" name="dt" type="text" value="">，以便您的CSS/JS可以执行任何需要的操作来为用户提供良好的界面。

来源

2014-09-27 01:13:44 Doobeh

是的，它的工作。不是遵循相同的“外观和感觉”的部件，但工作。谢谢。 – Pepeluis 2014-09-29 10:55:01

应该是'class _ ='datepicker' – imwilsonxu 2016-04-29 05:12:09

带Flask，Flask-Admin和WTforms的DatePickerWidget

回答

相关问题