如何使用WTF表单快速上传图像

时间:2018-05-04 06:54:09

标签: python web flask flask-wtforms wtforms

我在其他字段中上传图片时遇到问题。虽然存在其他字段的数据但图像不存在,因此表格未被验证。

这是后端,具体见图像文件字段,标有#IMAGE

from flask import Blueprint, request, render_template, redirect, flash
import os
from flask import current_app as app
from src.models.products.product import Product
from flask_wtf import FlaskForm
from wtforms import StringField, BooleanField, FileField, SubmitField
from wtforms.validators import InputRequired
from flask_wtf.file import FileField, FileRequired
from werkzeug.utils import secure_filename


dash_board_blueprint = Blueprint('dashboard', __name__, template_folder='templates')


class UploadForm(FlaskForm):
    name = StringField('Name', validators=[InputRequired()])
    category = StringField('Category', validators=[InputRequired()])
    sub_category = StringField('Sub Category', validators=[InputRequired()])
    size = StringField('Size', validators=[InputRequired()])
    variant = StringField('Variant', validators=[InputRequired()])
    price = StringField('Price', validators=[InputRequired()])
    enable_discount = BooleanField('Enable Discount')
    discount_price = StringField('Discount Price', validators=[InputRequired()])
    in_stock = BooleanField('In Stock')
    stock_amount = StringField('Stock Amount')
    text = StringField('Text')
    display_popular = BooleanField('Display Popular')
    image = FileField(validators=[FileRequired()]) # IMAGE
    submit = SubmitField("Add Product")

@dash_board_blueprint.route('/')
def dashboard():
    return render_template("dashboard/dashboard2.html", form=UploadForm())


@dash_board_blueprint.route('/upload', methods=['GET', 'POST'])
def upload():

    form = UploadForm()

    filename = form.image
    print("File Name:")
    print(filename)

任何类型的验证失败,图像包含无

这是HTML:

{% extends "dashboard_base.html" %}

{% block content %}

    {% macro render_form(form, action) %}
        {% from "_formhelpers.html" import render_field %}
        <div id="Product" class="variant-block" style="display: block;">
            {% from "_formhelpers.html" import render_field %}
            {% import "bootstrap/wtf.html" as wtf %}
            {{ wtf.quick_form(form, action=action, extra_classes="size-options", button_map={'submit':'light'}) }}
        </div>
    {% endmacro %}

    <div class="container-fluid">
        <div class="row" style="background-color: #FAF6EA !important; height: 125px"></div>
    </div>
    <div class="container-fluid">
        <div class="row">

            <!-- *** Product Creation *** -->
            <div style="background-color: #FAF6EA !important; " class=" container col-sm-4 mt-3 py-3 pl-5">
                {{ render_form(form, url_for('dashboard.upload')) }}
            </div>

1 个答案:

答案 0 :(得分:1)

您是否在表单中设置了enctype="multipart/form-data"

Per the Flask-WTF docs

  

请记住,将HTML表单的enctype设置为multipart / form-data,   否则request.files将为空。

<form method="POST" enctype="multipart/form-data">
    ...
</form>

您的示例使我相信您正在使用Flask-Bootstrap扩展。如果是的话,如果没有明确设置enctype,应该自动将"multipart/form-data"设置为FileField,并且您的表单中出现enctypeper the docs。但是,我想知道如果您声明表单的方式并非如此,则可能需要尝试在表单语句中显式设置transactions