Flask/Python - 处理下拉菜单以打开不同的 HTML 页面

Question

我正在学习烧瓶和 Python 以及 HTML 和 CSS。我有一个 Flask 模板来呈现下拉菜单。

我需要做的是：当您从下拉列表中选择一个值时，它会打开一个与所选值相对应的新 HTML 页面（选择不同选项的不同页面）。

我尝试在网上搜索，但找不到太多资源。当我通过提交按钮提交下拉选项时，页面会显示一条错误消息：

方法不允许

请求的 URL 不允许该方法。

请指导我找到最佳解决方案。

下面是我的代码。

pro.html

    <form name="startpage" method="POST" action="">
    <div class="form-group">
        <div class="input-group">
            <select name = "method_cipher" id = "method_cipher"> 
                <option value="Encrypt">Encrypt</option>
                <option value="Decrypt">Decrypt</option>
            </select>
            <select name = "cipher_type" id = "cipher_type"> 
                <option value="Caesar">Caesar</option>
                <option value="Transposition">Transposition</option>
                <option value="Reverse">Reverse</option>
            </select>
        </div>
        <button type="submit" name="submit" value="success" class="btn btn-default">Submit</button>
    </div>
    </form> 

test.py

    import flask
    APP = flask.Flask(__name__)
    @APP.route('/')
    def index():
        return flask.render_template('pro.html')
    @APP.route("/test" , methods=['GET', 'POST'])
    def test():
        if flask.request.method == 'POST':
            select = flask.request.form.get('method_cipher')
            if(select == 'Encrypt'):
                return flask.render_template('lastpage.html')
    if __name__ == '__main__':
        APP.debug=True
        APP.run()

编辑 - 我想为用户选择的不同下拉选项打开不同的网页（HTML 页面），例如当用户选择“加密”并提交时，如果他选择“解密”，我想打开“lastpage.html”然后是任何其他页面等等，以获得不同的选项。但事实并非如此。

Answer 1

pro.html 中的表单将数据发送到action 属性指定的 url。如果您将其保留或将其设置为空字符串，则请求将转到同一页面，即/。

但是您已经在不同的视图函数中设置了表单处理。你可能想发到那个。

所以更改您的表单以发布到正确的网址

<form ... action="/test" ...>

这可行，但在模板中硬编码目标 url 不是一个好主意。我假设您使用的是jinja，因此您可以让它为您插入网址

<form ... action="{{ url_for("test") }}" ...>

如果您还没有，请查看url_for 函数。

Answer 2

只需这样做

<select onchange ="if (this.value)window.location.href=this.value">
    <option value="/target1">test1<option>
    <option value="/target2">test2<option>
</select>