簡體   English   中英

是否可以覆蓋的值<Input type = "hidden">通過讓用戶從下拉列表中選擇?

[英]Is it possible to overwrite the value of <Input type = "hidden"> by letting user select from a drop down list?

我想將“0”分配給我在 HTML 中的一個熱編碼變量,當用戶選擇一個選項時,該值將從“0”變為“1”

我的下拉列表:“蘋果”、“橙子”、“葡萄”

我想為所有這些分配一個值 0 開始然后當用戶選擇“apple”時,它的值在提交給預測器時更改為“1”

這是我的 HTML 代碼

<!DOCTYPE html>
<html >
<head>
  <title>BOOM</title>
  <style>
    body {
        font-family: Verdana;
        font-size: 12px;
    }
  </style> 
</head>

<body>
    
    
    <h1>MPrediction</h1>

<form action="/predict"method="post">
    <input type="hidden" name="circle" value="0">
    <input type="hidden" name="triangle" value="0">
    <input type="hidden" name="square" value="0">
    
    <input type="hidden" name="red" value="0">
    <input type="hidden" name="green" value="0">
    <input type="hidden" name="blue" value="0">

    
        <select>
            <option value="none" selected disabled hidden>
              Select A Shape
          </option>
            <option name='circle' value="1">circle</option>
            <option name='triangle' value="1">triangle</option>
            <option name='square' value="1">square</option>
            
        </select>

        <select>
            <option value="none" selected disabled hidden>
              Select A Colour
          </option>
            <option name='red' value="1">red</option>
            <option name='green' value="1">green</option>
            <option name='blue' value="1">blue</option>

        </select>

<button type="submit">Predict</button>
    </form>
   <p>{{ my_prediction }}</p>
</body>
</html>

我現在遇到的問題是用戶無法更改隱藏類型輸入。 我曾想過使用 2 種形式,第一種是隱藏輸入,第二種是選擇,這將導致其中一個預測變量為機器學習不接受的“01”。 在燒瓶中有什么方法可以讓代碼選擇所選變量的第二個值,其余的只是“0”。 就像我選擇“circle”,系統從隱藏表單中獲取“0”,從選擇表單中獲取“1”,當它進入燒瓶時,所有變量都需要“0”,“circle”變量需要“1” ? 請幫忙! 如果我不能讓它發揮作用,我可能會失去我的成績。

這是我的 python Flask 代碼(我使用的是 jupyter notebook)

import numpy as np
from flask import Flask, request, render_template
import joblib

app = Flask(__name__)
model = joblib.load('MC_Model.pkl')

@app.route('/')
def home():
    return render_template('BOM.html')


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

    form_data = [float(x) for x in request.form.values()]
    features = [np.array(form_data)]
    prediction = model.predict(features)

    return render_template('BOM.html', MC_prediction='Usage Amount:{} '.format(prediction[0]))

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

至於我你的selectsoptions是完全錯誤的,你不需要hidden

您應該在<select>name並且每個<option>都應該有 uniq value - 它可以是features索引

    <select name="shape">
        <option value="" selected disabled hidden>Select A Shape</option>
        <option value="0">circle</option>
        <option value="1">triangle</option>
        <option value="2">square</option>
    </select>

然后你不需要hidden ,在 Flask 中你可以獲得價值並用作index

features = [np.zeros(6)]

shape = request.form.get('shape')

if shape:  # if shape is not None:
    index = int(shape)
    features[0][index] = 1

我還添加了將"selected"分配給先前選擇的option代碼。

<option value="0" {% if shape == 0 %}selected{% endif %}>circle</option>

它需要將shapecolor發送到模板。


完整的工作示例。

我使用render_template_string在代碼中包含 HTML,以便其他人可以簡單地復制和運行它。

from flask import Flask, request, render_template_string
import numpy as np

app = Flask(__name__)

@app.route('/', methods=["GET", "POST"])
def home():
    # default values for `GET`
    color = None
    shape = None
    features = [np.zeros(6)]
    text = 'Usage Amount: ???'
    
    if request.method == 'POST':
        color = request.form.get('color')
        print('color:', color)
        
        shape = request.form.get('shape')
        print('shape:', shape)
                  
        if color:
            index = int(color)
            features[0][index] = 1
        if shape:
            index = int(shape)
            features[0][index] = 1
        print(features)
        
        #prediction = model.predict(features)
        prediction = [np.random.randint(0, 100)]
        
        text = 'Usage Amount: {}'.format(prediction[0])
                
    return render_template_string('''
<form action="/" method="POST">
    <select name="shape">
        <option value="" {% if not shape %}selected{% endif %} disabled hidden>Select A Shape</option>
        <option value="0" {% if shape == 0 %}selected{% endif %}>circle</option>
        <option value="1" {% if shape == 1 %}selected{% endif %}>triangle</option>
        <option value="2" {% if shape == 2 %}selected{% endif %}>square</option>
    </select>

    <select name="color">
        <option value="" {% if not color %}selected{% endif %} disabled hidden>Select A Colour</option>
        <option value="3" {% if color == 3 %}selected{% endif %}>red</option>
        <option value="4" {% if color == 4 %}selected{% endif %}>green</option>
        <option value="5" {% if color == 5 %}selected{% endif %}>blue</option>
    </select>

    <button type="submit">Predict</button>
</form>

<p>features: {{ features }}</p>
<p>prediction: {{ prediction }}</p>
''', prediction=text, features=features[0], color=color, shape=shape)

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

我正在考慮使用帶有形狀和顏色的列表來生成帶有for循環的options

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM