如何使用Flask和HTML從python列表創建下拉菜單

我試圖使用來自python腳本的信息在HTML中創建下拉菜單。到目前爲止，我已經完成了它的工作，但是，html下拉菜單將列表中的所有4個值顯示爲4個選項。如何使用Flask和HTML從python列表創建下拉菜單

當前：選項1：紅色，藍色，黑色橙色; 選項2：紅色，藍色，黑色，橙色等。（截圖中的鏈接） Current

期望：選項1：紅 選項2：藍等

我如何使它成爲python列表是分開的？

dropdown.py

from flask import Flask, render_template, request 
app = Flask(__name__) 
app.debug = True 


@app.route('/', methods=['GET']) 
def dropdown(): 
    colours = ['Red', 'Blue', 'Black', 'Orange'] 
    return render_template('test.html', colours=colours) 

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

的test.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Dropdown</title> 
</head> 
<body> 
<select name= colours method="GET" action="/"> 
    {% for colour in colours %} 
    <option value= "{{colour}}" SELECTED>{{colours}}</option>" 
    {% endfor %} 
</select> 

</select> 
</body> 
</html>

來源

2017-08-25 DeeChok

你有一個錯字，更換colours到colour

<option value= "{{colour}}" SELECTED>{{colours}}</option>"

更換到

<option value= "{{colour}}" SELECTED>{{ colour }}</option>" 
            <!-- ^^^^ -->

來源

2017-08-25 08:16:24

你需要使用在這兩個地方{{colour}}（而不是{{colours}}排在第二位）：

<select name="colour" method="GET" action="/"> 
    {% for colour in colours %} 
     <option value="{{colour}}" SELECTED>{{colour}}</option>" 
    {% endfor %} 
</select>

注意，使用selected內環路將selected屬性添加到所有選項，最後一個將被選中，你需要做的是以下幾點：

<select name="colour" method="GET" action="/"> 
    <option value="{{colours[0]}}" selected>{{colours[0]}}</option> 
    {% for colour in colours[1:] %} 
    <option value="{{colour}}">{{colour}}</option> 
    {% endfor %} 
</select>

來源

2017-08-25 08:16:32 ettanany

謝謝ettanany！我將顏色更改爲顏色並將「已選」 – DeeChok

如何使用Flask和HTML從python列表創建下拉菜單

回答

相關問題