Question

我将页面与自动完成表单放在一起，当我尝试提交信息时，页面只是刷新而没有遵循正确的路线。因此，如果有人在表单中输入“ Abc”，则该表单会正确提示“ Abc”。如果他们选择“ Abc”，然后单击“提交”，那么我正在尝试路由到/ foo / Abc。

烧瓶：

from flask import Flask, jsonify, Response, render_template, request, redirect
import json
from flask_wtf import Form
from wtforms import TextField, BooleanField, PasswordField, TextAreaField, SubmitField, validators
from engine import *

app = Flask(__name__)
app.static_folder = 'static'

foo_list = ['Abc', 'Bcd', 'Cde', 'Def']

@app.route("/", methods=['GET', 'POST'])
def index():
    form = SearchForm(request.form)
    if form.validate_on_submit():
        form_data = form.autocomp.data
        return redirect(url_for('/foo/', form_data))
    return render_template('index.html', form=form)

@app.route("/foo/<title>")
def randomFunction(title):
    #code that it runs
return render_template('foo.html')

class SearchForm(Form):
    autocomp = TextField('Enter Search Term', id='foo_autocomplete')
    submit = SubmitField('Search')

@app.route('/_autocomplete', methods=['GET'])
def autocomplete():
    return Response(json.dumps(foo_list), mimetype='application/json')

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

HTML：

<form method="POST" novalidate>
{{ form.autocomp.label }}: {{ form.autocomp }} {{ form.submit() }}
</form>

<script>
   $(function() {
      $.ajax({
       url: '{{ url_for("autocomplete") }}'
          }).done(function (data){
             $('#foo_autocomplete').autocomplete({
                    source: data,
                    minLength: 2
                });
            });
        });
</script>

编辑：

弄清楚了。将索引路由代码更改为：

def index():
    form = SearchForm(request.form)
    if request.method == 'POST':
        title = form.autocomp.data.replace(" ", "%20")
        return redirect('http://127.0.0.1:5000/rec/' + title)

WTForms表单提交仅刷新页面，而不重定向

0 个答案: