繁体   English   中英

从动态相关下拉列表中获取所选选项 - 使用 Flask (Python)

[英]Get selected option from dynamic dependent dropdown list - using Flask (Python)

我试图在动态相关下拉列表中检索所选选项,但我只使用request.form.get得到None 我的示例在下图中生成一个下拉列表:

在此处输入图像描述

生成下拉列表的完整代码如下,它基于对这个问题的回答。

from flask import Flask, render_template_string, request, redirect

app = Flask(__name__)

@app.route('/', methods=["GET", "POST"])
def index():

    systems = {
        'PlayStation': {'Spyro': ['1', '2', '3'], 'Crash': ['4', '5', '6'], 'Ico': ['7', '8']},
        'N64': {'Mario Kart': ['Mario', 'Luigi'], 'Superman': ['12', '13', '14']}
    }
    
    if request.method == "POST":

        systemGet = request.form.get("system")
        gameGet = request.form.get("game")
        charactersGet = request.form.get("characters")
        
        print(systemGet)
        print(gameGet)
        print(charactersGet)

        return redirect('temp.html')

    return render_template_string(template, systems=systems)
    
    

template = """
<!doctype html>
<form method="POST">
    <select id="system">
        <option></option>
    </select>
    <select id="game"></select>
    <select id="characters"></select>
    <button type="submit">Play</button>
</form>
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script>
    "use strict";

    var systems = {{ systems|tojson }};

    var form = $('form');
    var system = $('select#system');
    var game = $('select#game');
    var characters = $('select#characters');

    for (var key in systems) {
        system.append($('<option/>', {'value': key, 'text': key}));
    }

    system.change(function(ev) {
        game.empty();
        game.append($('<option/>'));

        var games = systems[system.val()];

        for (var i in games) {
            game.append($('<option/>', {'value': i, 'text': i}));
        }
    });
    
    game.change(function(evV) {
        characters.empty();
        characters.append($('<option/>'));

        var games = systems[system.val()][game.val()];

        for (var i in games) {
            characters.append($('<option/>', {'value': games[i], 'text': games[i]}));
        }
    });

</script>
"""

if __name__ == '__main__':
    app.run()

编辑:包括name属性,如@vremes 所建议的那样,一切正常。 解决方案变为:

from flask import Flask, render_template_string, request, redirect

app = Flask(__name__)

@app.route('/', methods=["GET", "POST"])
def index():

    systems = {
        'PlayStation': {'Spyro': ['1', '2', '3'], 'Crash': ['4', '5', '6'], 'Ico': ['7', '8']},
        'N64': {'Mario Kart': ['Mario', 'Luigi'], 'Superman': ['12', '13', '14']}
    }
    
    if request.method == "POST":

        systemGet = request.form.get("system")
        gameGet = request.form.get("game")
        charactersGet = request.form.get("characters")
        
        print(systemGet)
        print(gameGet)
        print(charactersGet)

        return redirect('temp.html')

    return render_template_string(template, systems=systems)
    
    

template = """
<!doctype html>
<form method="POST">
    <select id="system" name="system">
    </select>
    
    <select id="game" name="game">
    </select>
    
    <select id="characters" name="characters">
    </select>
        
    <button type="submit">Play</button>
</form>
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script>
    "use strict";

    var systems = {{ systems|tojson }};

    var form = $('form');
    var system = $('select#system');
    var game = $('select#game');
    var characters = $('select#characters');

    for (var key in systems) {
        system.append($('<option/>', {'value': key, 'text': key}));
    }

    system.change(function(ev) {
        game.empty();
        game.append($('<option/>'));

        var games = systems[system.val()];

        for (var i in games) {
            game.append($('<option/>', {'value': i, 'text': i}));
        }
    });
    
    game.change(function(evV) {
        characters.empty();
        characters.append($('<option/>'));

        var games = systems[system.val()][game.val()];

        for (var i in games) {
            characters.append($('<option/>', {'value': games[i], 'text': games[i]}));
        }
    });

</script>
"""

if __name__ == '__main__':
    app.run()

request.form.get依赖于 HTML name属性,将name属性添加到每个select下拉列表中,例如:

<!-- request.form.get('system') should work now -->
<select id="system" name="system">
    <option value="mario">Mario</option>
</select>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM