是否可以覆盖的值<Input type = "hidden">通过让用户从下拉列表中选择？

Question

我想将“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)

Answer 1

至于我你的selects和options是完全错误的，你不需要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>

它需要将shape 、 color发送到模板。

完整的工作示例。

我使用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 。

是否可以覆盖的值<Input type = "hidden">通过让用户从下拉列表中选择？

问题描述

1 个解决方案

解决方案1
0 2021-11-07 18:33:59

是否可以覆盖的值<Input type = "hidden">通过让用户从下拉列表中选择？

问题描述

1 个解决方案

解决方案1 0 2021-11-07 18:33:59

解决方案1
0 2021-11-07 18:33:59