如何将滑块值从 html 表单导入到 Flask 应用程序

Question

如何将滑块值从 html 表单导入到 Flask 应用程序

我创建了一个包含 6 个滑块和一个提交按钮的 html 表单。我想将滑块的值作为整数值获取到我的烧瓶应用程序中

<form id="upload-form" action="{{ url_for('index') }}" method="POST" enctype="multipart/form-data">

        <fieldset>
        <!-- Hospital Slider -->    
            <div class="col-md-4">
                <h4>Hospital Services</h4>
            </div>  
            <div class="col-md-8">
                <div class="""slidecontainer">
                          <input type="range" min="0" max="100" value="50" class="slider" id="sliderHospital">
                          <br>
                </div>
            </div>

        <!-- Ambulance Slider -->   
            <div class="col-md-4">
                <h4>Ambulance Services</h4>
            </div>  
            <div class="col-md-8">
                <div class="""slidecontainer">
                          <input type="range" min="0" max="100" value="50" class="slider" id="sliderAmbulance">
                          <br>
                </div>
            </div>      

        <!-- School Slider -->      
            <div class="col-md-4">
                <h4>School Services</h4>
            </div>  
            <div class="col-md-8">
                <div class="""slidecontainer">
                          <input type="range" min="0" max="100" value="50" class="slider" id="sliderSchool">
                          <br>
                </div>
            </div>

        <!-- Fire and Rescue Slider -->     
            <div class="col-md-4">
                <h4>Fire and Rescue Services</h4>
            </div>  
            <div class="col-md-8">
                <div class="""slidecontainer">
                          <input type="range" min="0" max="100" value="50" class="slider" id="sliderFire">
                          <br>
                </div>
            </div>  

            <!-- Markets Slider -->     
            <div class="col-md-4">
                <h4>Markets and Shopping malls</h4>
            </div>  
            <div class="col-md-8">
                <div class="""slidecontainer">
                          <input type="range" min="0" max="100" value="50" class="slider" id="sliderMarket">
                          <br>
                </div>
            </div>

            <!-- Green spaces -->   
            <div class="col-md-4">
                <h4>Green spaces</h4>
            </div>  
            <div class="col-md-8">
                <div class="""slidecontainer">
                          <input type="range" min="0" max="100" value="50" class="slider" id="sliderparks">
                          <p>Value: <span id="demo"></span></p><br>
                </div>
            </div>


                <div class="col-md-6 col-lg-offset-2">
                    <button type="reset" class="btn btn-default" onclick="myFunction()">Cancel</button>
                    <button type="submit" class="btn btn-primary">Submit</button>
                </div>
                <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                              </div>
            </fieldset>
             </form>

Run Code Online (Sandbox Code Playgroud)

这是我的烧瓶应用程序代码

from flask import Flask, render_template, request
from flask_wtf import FlaskForm
from wtforms import StringField, IntegerRangeField, PasswordField, TextAreaField, TextField, RadioField, SelectField, FileField, IntegerField, DateField
from wtforms.validators import InputRequired
import os
import os

app = Flask(__name__)
app.debug=True

app.config['SECRET_KEY'] = 'Thisisasecret!'

APP_ROOT = os.path.dirname(os.path.abspath(__file__))

class TestForm(FlaskForm):
    sliderHospital = DecimalRangeField('Hospital', default=0)

@app.route('/')
def index():
    return render_template('index.php')



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

Run Code Online (Sandbox Code Playgroud)

当我运行应用程序时出现此错误

导入错误：无法导入名称 IntegerRangeField

我想从表单中获取值并将它们保存为 Flask 应用程序中的 6 个单独变量。我错过了什么吗？

Answer 1

sta*_*mer 5

您应该为每个范围类型输入命名。您可以从flask 的请求中获取该输入的值。

演示：

<html>
    <head></head>
    <body>
        <form method="POST" action="test">
            <input type="range" min="0" max="100" name="name_of_slider" />
            <input type="submit" value="submit" />
        </form>
    </body>
</html>


from flask import request
@app.route("/test", methods=["POST"])
def test():
    name_of_slider = request.form["name_of_slider"]
    return name_of_slider

Run Code Online (Sandbox Code Playgroud)

使用您的代码时出现此错误：`werkzeug.exceptions.HTTPException.wrap.<locals>.newcls: 400 Bad Request: The browser (or proxy) sent a request that this server could not understand. ` (3认同)

归档时间：	7 年，9 月前
查看次数：	7566 次
最近记录：	7 年，9 月前