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

问题描述 投票:0回答:1

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

<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> 

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

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() 

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

ImportError:无法导入名称IntegerRangeField

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

python flask flask-wtforms
1个回答
2
投票

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

演示:

<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
© www.soinside.com 2019 - 2024. All rights reserved.