Flask - 使用 request.form.get 时获取 NoneType



我知道这个问题已经被问了好几次,但不幸的是,由于我的知识仍然非常有限,我无法完全掌握其他答案。我的尝试已经减少到基本上弄乱了POSTGET方法以及尝试request.form.get()request.form[]request.args.get()但是我得到了上述错误或method not allowed错误或bad request错误。

我创建了一个简单的网站,用户可以在其中选择两个数字(1 或 2(,第一个来自下拉列表中,第二个来自比率选项。输出应该是这些数字的总和,但是当我单击提交按钮时,我不断收到错误

TypeError: unsupported operand type(s) for +: 'NoneType' and 'NoneType'

我的 python 应用程序如下所示:

from flask import Flask, render_template,request
app=Flask(__name__)
@app.route('/')
def main():
return render_template('example.html')
@app.route('/model',methods=['GET','POST'])
def model():
first=request.form.get('inputFirst',type=int)
second=request.form.get('inputSecond',type=int)
suma=first+second
return render_template('final.html',suma=suma)
if __name__ == "__main__":
app.run(debug=True)

这是主要的 html 文件 (example.html(

<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<script src="../static/js/jquery-3.2.1.js"></script>
<script src="../static/js/model.js"></script>
</head>
<body>
<div class="container">
<div class="jumbotron">
<form>
<h2>Choose one number</h2>
<label for="firstNumber" class="sr-only">First Number</label>
<select name="inputFirst" id="firstNumber" required>
<option value="1" label="One">1</option>
<option value="2" label="Two" selected>2</option>
</select>
<h2> Choose another number</h2>   
<input type="radio" name="inputSecond" id="one1" value="1" required/>
<label for="one1">1</label>
<input type="radio" name="inputSecond" id="two2" value="2"/>          
<label for="two2">2</label>
<button onclick="location.href='/model'" id="btnModel" class="btn btn-lg btn-primary btn-block" type="button">Run model</button>
</form>
</div> 
</div>
</body>
</html> 

这是model.js文件

$(function(){
$('#btnModel').click(function(){
$.ajax({
url: '/model',
data: $('form').serialize(),
type: 'POST',
success: function(response){
console.log(response);
},
error: function(error){
console.log(error);
}
});
});
});

对于输出,这里是final.html文件

<html>
<head>
<h1>RESULT</h1>
</head>
<body>
<h3>The result is: {{suma}} </h3>
</body>
</html>

作为最后一次尝试,我尝试通过request.form.get('inputFirst',0,type=int)更改request.form.get('inputFirst',type=int),并类似地通过request.form.get('inputSecond',0,type=int)更改request.form.get('inputSecond',type=int),在这种情况下,网站可以正常工作,因此如果我理解正确,example.html中的表单不会保存用户选择的数字,但是example.html文件中的名称inputFirstinputSecond与python文件中的请求方法中的名称相匹配。所以我不确定会有什么问题。

任何帮助,不胜感激。

jQuery serialize(( 方法通过序列化表单 val 来创建 URL 编码的文本字符串。您的最终请求是

/model?inputFirst=1&inputSecond=2

在烧瓶中访问值的方法是

inputFirst = request.values.get('inputFirst')
inputSecond = request.values.get('inputSecond')

然后,您可以按照上一个答案的建议将它们转换为整数

编辑我将添加一个基本的工作示例。我已经结合了我的html和javascript,我相信你会知道如何分离和即兴

.HTML

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$("#myForm").submit(function(e) {
e.preventDefault();
});
function upload(){
$.ajax({
method: "POST",
url: "/model",
data: $('form').serialize(),
success:function(res){
var content = res;
$("div").text(content);
}
});
return false;
}

</script>
</head>
<body>
<body>
<form id="myForm" method="post">
<h2>Choose one number</h2>
<label for="firstNumber" class="sr-only">First Number</label>
<select name="inputFirst" id="firstNumber" required>
<option value="1" label="One">1</option>
<option value="2" label="Two" selected>2</option>
</select>
<h2> Choose another number</h2>   
<input type="radio" name="inputSecond" id="one1" value="1" required/>
<label for="one1">1</label>
<input type="radio" name="inputSecond" id="two2" value="2"/>          
<label for="two2">2</label>
<button  id="btnModel" onclick="return upload();">Run model</button>
</form>
<div>Submitted info comes here</div>
</body>
</body>
</html>

在我看来

@app.route('/model',methods=['GET','POST'])
def model():
if request.method == 'POST':
inputFirst = request.values.get('inputFirst')
inputSecond = request.values.get('inputSecond')
if inputFirst is None:
inputFirst = "Not Submitted"
if inputSecond is None:
inputSecond = "Not Submitted"
return "firstInput: "+inputFirst+' '+ "secondInput: "+inputSecond
else:
return render_template('test.html')

需要注意的是, 我已经禁用了普通表单提交并使用 js 处理它。这意味着您的表单验证将不起作用。您可以在 js 中包含验证。现在,我只是检查视图中提交的值是否为"无"。

我创建了一个div,在单击按钮时将其替换为您提交的值。由于您可能有多个div(我在该代码中只有一个(,因此您可能希望给div 一个 id,这样它就不会替换所有div

希望这会有用

我已将表单方法作为帖子,以防您在刷新时在 url 中获得提交的值,您可能省略了它,并且您的代码执行默认的 get 方法

表单值不会是整数,您需要将字符串转换为整数

first=request.form.get('inputFirst')
second=request.form.get('inputSecond')
sum = int(first) + int(second)

相关内容

最新更新