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

问题描述 投票：0回答：2

我知道这已被问过几次，但不幸的是我无法完全掌握其他答案，因为我的知识仍然非常有限。我的尝试已经减少到基本上搞乱了POST和GET方法以及尝试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.htmlfile

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

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

任何帮助表示赞赏。

jquery flask get request
2个回答
1
投票

jQuery serialize（）方法通过序列化表单val来创建URL编码的文本字符串。你的最终要求是什么样的

/model?inputFirst=1&inputSecond=2

以及在烧瓶中访问您的值的方法是

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

然后你可以将它们转换为整数，如前面的答案所示

编辑我将添加一个基本的工作示例。我已经结合了我的HTML和JavaScript，我相信你会知道如何分离和improt

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中包含验证。现在，我只是检查视图中提交的值是否为None。

我已经创建了一个div，它在按钮点击时被提交的值替换。因为你可能有几个div（我在该代码中只有一个），你可能想给div一个id，所以它不会替换你所有的div

希望这会有用

我把表单方法作为post，因为你在刷新的url中获取了提交的值，你可能已经省略了它并且你的代码执行了默认的get方法

0
投票

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

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

sum = int(first) + int(second)
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.