Flask-WTF:表格从不提交

时间:2015-02-06 18:58:04

标签: javascript python forms flask flask-wtforms

我正在尝试提交表单并处理结果,但是当我按下提交按钮时,form.is_submitted()返回False,request.method返回“GET”。这是我的表格:

<form name="create" action="" role="form" class="smart-wizard   form-horizontal" id="form" type="post">
{{ form.hidden_tag() }}
<div class="row">
    <div class="col-sm-12">
        <!-- start: FORM WIZARD PANEL -->
        <div id="wizard" class="swMain">
            <ul>
                <li>
                    <a href="#step-1">
                        <div class="stepNumber">
                            1
                        </div>
                        <span class="stepDesc"> Step 1
                            <br />
                            <small>General Information</small> </span>
                    </a>
                </li>
                <li>
                    <a href="#step-2">
                        <div class="stepNumber">
                            2
                        </div>
                        <span class="stepDesc"> Step 2
                            <br />
                            <small>Lane(s)</small> </span>
                    </a>
                </li>
                <li>
                    <a href="#step-3">
                        <div class="stepNumber">
                            3
                        </div>
                        <span class="stepDesc"> Step 3
                            <br />
                            <small>Load Details</small> </span>
                    </a>
                </li>
            </ul>
            <div class="progress progress-striped active progress-sm">
                <div aria-valuemax="100" aria-valuemin="0" role="progressbar" class="progress-bar progress-bar-success step-bar">
                    <span class="sr-only"> 0% Complete (success)</span>
                </div>
            </div>
            <div id="step-1">
                <h2 class="StepTitle">Step 1 Content</h2>
                <hr>
                <div class="row">
                    <div class="col-sm-5">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">
                                Load Type <span class="symbol required"></span>
                            </label>
                            <div class="col-sm-7">
                                {{ form.load_type(class="form-control") }}
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">
                                Required Trailer <span class="symbol required"></span>
                            </label>
                            <div class="col-sm-7">
                                {{ form.trailer_type(class="form-control") }}
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">
                                Total Miles <span class="symbol required"></span>
                            </label>
                            <div class="col-sm-7">
                                {{ form.total_miles(class="form-control", placeholder="Total Miles") }}
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">
                                Cost <span class="symbol required"></span>
                            </label>
                            <div class="col-sm-7">
                                {{ form.price(class="form-control", placeholder="Price") }}
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-5">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">
                                # Pieces <span class="symbol required"></span>
                            </label>
                            <div class="col-sm-7">
                                {{ form.number_pieces(class="form-control", placeholder="Number of Pieces") }}
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">
                                Over Dimensional? 
                            </label>
                            <div class="col-sm-7">
                                {{ form.over_dimensional() }}
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">
                                Comments <span class="symbol required"></span>
                            </label>
                            <div class="col-sm-7">
                                {{ form.comments(class="form-control", placeholder="Number of Pieces") }}
                            </div>
                        </div>
                    </div>  
                </div>
                <hr>
                <div class="row">
                    <div class="col-sm-10">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">
                                Load Description
                            </label>
                            <div class="col-sm-7">
                                {{ form.description(class="autosize form-control", style="overflow: hidden; word-wrap: break-word; resize: horizontal; height: 69px;") }}
                            </div>
                        </div>
                    </div>
                </div>
                <hr>
                <div class="form-group">
                    <div class="col-sm-3 col-sm-offset-7">
                        <button class="btn btn-blue next-step btn-block">
                            Next <i class="fa fa-arrow-circle-right"></i>
                        </button>
                    </div>
                </div>
            </div>
            <div id="step-2">
                <h2 class="StepTitle">Step 2 Content</h2>
                <div class="col-md-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <i class="fa fa-external-link-square"></i>
                            Editable Table
                            <div class="panel-tools">
                                <a class="btn btn-xs btn-link panel-collapse collapses" href="#"> </a>
                                <a class="btn btn-xs btn-link panel-config" href="#panel-config" data-toggle="modal"> <i class="fa fa-wrench"></i> </a>
                                <a class="btn btn-xs btn-link panel-refresh" href="#"> <i class="fa fa-refresh"></i> </a>
                                <a class="btn btn-xs btn-link panel-expand" href="#"> <i class="fa fa-resize-full"></i> </a>
                                <a class="btn btn-xs btn-link panel-close" href="#"> <i class="fa fa-times"></i> </a>
                            </div>
                        </div>
                        <div class="panel-body">
                            <div class="row">
                                <div class="col-md-12 space20">
                                    <button class="btn btn-green add-row">
                                        Add New <i class="fa fa-plus"></i>
                                    </button>
                                </div>
                            </div>
                            <div class="table-responsive">
                                <table class="table table-striped table-hover" id="sample_2">
                                    <thead>
                                        <tr>
                                            <th>Stop #</th>
                                            <th>Type</h>
                                            <th>Street Address</th>
                                            <th>City</th>
                                            <th>State</th>
                                            <th>Zip</th>
                                            <th>Delete</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <!--- Table content created by table-data.js -->
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

                </div>
                <hr>
                <div class="form-group">
                    <div class="col-sm-2 col-sm-offset-3">
                        <button class="btn btn-light-grey back-step btn-block">
                            <i class="fa fa-circle-arrow-left"></i> Back
                        </button>
                    </div>
                    <div class="col-sm-2 col-sm-offset-3">
                        <button type="submit" class="btn btn-success btn-block">
                            Finish <i class="fa fa-arrow-circle-right"></i>
                        </button>
                    </div>
                </div>
            </div>
        </div>                          
        <!-- end: FORM WIZARD PANEL -->
    </div>
</div>

作为参考,这是我处理表格的视图:

@loads.route('/create', methods=['GET', 'POST'])
@login_required
def create():
    form = LoadForm()
    flash(form.is_submitted()) #returns False
    flash(request.method) # returns 'GET'
    if form.validate_on_submit():
        #handle form logic
    return render_template('load/create2.html',
                        title="Create Load",
                        active="Loads",
                        form=form, user=g.user)

1 个答案:

答案 0 :(得分:1)

为表单标记添加方法属性:

<form name="create" action="" role="form" class="smart-wizard   form-horizontal" id="form" type="post" method="post">

空的或缺少的@method属性默认为GET。