python烧瓶形式中的所有链接都表现得像提交答案

【问题标题】：All links in python flask form behave like submitpython烧瓶形式中的所有链接都表现得像提交
【发布时间】：2019-09-22 19:18:53
【问题描述】：

我正在尝试让烧瓶表单中的所有链接正常工作：

如果我按下普通链接<a href="/"></a>，我的表单就像我按下了提交按钮一样。为了更好地理解，这里有一个解释，我到底想要什么：
如果我通过烧瓶调用station_form.html，我会得到带有预填输入的输入表单。可以更改这些输入。如果我按Back 或Upload，它会调用mod_station。这不应该发生。
GIF-Example of my problem - it should let me upload a file. The file upload windows opens in the background, but flask don't stay on this page.

station_form.html

<form action="{{ url_for('mod_station', old_station=form.station_name.data) }}" enctype="multipart/form-data" method="post">
    <fieldset>
        <legend>Modify {{ form.station_name.data }}</legend>
            <div class="row responsive-label label_center spacer_20">
                <div class="col-sm-12 col-md-3 row_title">{{ form.station_name.label }}</div>
                <div class="col-sm-12 col-md">{{ form.station_name }}</div>
            </div>
            <div class="row responsive-label label_center spacer_20">
                <div class="col-sm-12 col-md-3 tooltip row_title" aria-label="Only a *.png file.">{{ form.station_cover.label }}</div>
                <div class="col-sm-12 col-md">
                    <div class="upload_wrapper">
                        <button class="secondary button_fix">{{ form.station_cover }}Upload cover</button>
                    </div>
                </div>
            </div>
            <div class="row responsive-label label_center">
                <div class="col-sm-6 col-md-3"><a href="/"><button class="secondary large">Back</button></a></div>
                <div class="col-sm-0 col-md-6"></div>
                <div class="col-sm-6 col-md-3">
                    {{ form.submit(class="tertiary large add_station_submit", value="Modify station") }}
                </div>
            </div>
    </fieldset>
</form>

forms.py

class AddStationForm(FlaskForm):
    station_name = StringField('Station name', validators=[DataRequired()])
    station_cover = FileField('Cover', validators=[FileAllowed(['png'], '*.png only!')])

    submit = SubmitField('Add station')

main.py


@app.route("/station_form")
def station_form(station=None):
    form_station = AddStationForm()
    if station is not None:
        form_station.station_name.data = station[1]
    countries = helpers.load_country_choices()
    success = False

    return render_template('station_form.html', form=form_station, countries=countries)

@app.route('/mod_station/<string:old_station>', methods=['POST'])
def mod_station(old_station):
    if request.method == 'POST':
        old_name = old_station
        if 'station_cover' in request.files:
            file = request.files['station_cover']
            if file.filename != '' and file and allowed_file(file.filename):
                filename = secure_filename(file.filename)
                file.save(os.path.join(TEMP_PATH, filename))
                success, message, station = station_model.modify_station(request.form, os.path.join(TEMP_PATH, filename), old_name)
                return render_template('report.html', success=success, message=message, station=station)
        filename = request.form['station_name'] + ".png"
        old_file = os.path.join(THUMBS_PATH, old_name + ".png")
        new_file = os.path.join(THUMBS_PATH, filename)
        os.rename(old_file, new_file)
        success, message, station = station_model.modify_station(request.form, filename, old_name)
        return render_template('report.html', success=success, message=message, station=station)

我已经尝试减少代码。希望你能告诉我，我的错误在哪里。谢谢。

【问题讨论】：

标签： python html forms flask httprequest

【解决方案1】：

<button> 元素默认提交表单。为了防止它提交表单，您必须将其类型显式设置为type="button"。

您的 a 元素包含没有类型的按钮，因此请为它们添加类型，例如

<button class="secondary button_fix" type="button">{{ form.station_cover }}Upload cover</button>

您可以在其w3 specification 中阅读有关按钮元素行为的更多信息

【讨论】：