如何将数据从Python FLASK输入到数据库?

时间:2018-05-19 14:59:52

标签: javascript python mysql database flask

我已经获得了以下Python代码:

@restServer.route("/sendData", methods=['POST'])
def client():
ID = request.form.get('ID')
name = request.form.get('name')
postcode = request.form.get('postcode')
dateofbirth = request.form.get('dateofbirth')
balance = request.form.get('balance')
description = request.form.get('description')

insert_stmt = (
    "INSERT INTO clients (ID, name, postcode, dateofbirth, balance, description) "
    "VALUES (%s, %s, %s, %s, %s, %s)"

)
data = (ID, name, postcode, dateofbirth, balance, description)
cursor.execute(insert_stmt, data)
conn.commit()
print("Did we do it?")
return jsonify(data)

我还获得了以下HTML代码:

  <form method="POST">
         <p>ID of your Avenger:</p> <input type="number" id="ID" required> 
       <p>Name of your Avenger:</p> <input type="text" id="name" required> 
         <p>Post Code of your Avenger:</p> <input type="text" id="postcode" required> 
          <p>Date of Birth of your Avenger:</p> <input type="date" id="dateofbirth" required> 
          <p>Bank balance of your Avenger:</p> <input type="number" id="balance" required> 
          <p>Description of your Avenger:</p> <input type="text" id="description" required> 


        <button class="button1" type="button" id="hashButton" onclick="nameInput()">Submit</button></form>

最后是以下Javascript代码:

  function nameInput() {
   var words = document.getElementById("ID", "name", "postcode", "dateofbirth", "balance", "description" ).value;
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
  if(this.readyState == 4 && this.status == 200) {
  var json = JSON.parse(this.responseText);
  document.getElementById("nameInputReturn").innerHTML = 
  json.name;
  }
  }

        xhttp.open("POST", "http://127.0.0.1:5000/sendData", true);
        xhttp.setRequestHeader("Content-type", "application/x-www-form- 
 urlencoded");
        xhttp.send(words);
    }

我试图制作它,以便您可以将数据输入到表单中,然后将数据上传到数据库中。我已经弄清楚如何输入我在代码中指定的数据,只需更改内部的部分变量即可 data = (ID, name, postcode, dateofbirth, balance, description)行。目前,单击了提交按钮,但数据库只添加了一行,每行都有NULL。

我对Flask很新,所以感谢任何帮助!

1 个答案:

答案 0 :(得分:2)

你的前端有点乱。看起来你正试图通过JS发送POST请求,当你的HTML可以做得更好更容易。

尝试从提交按钮中删除侦听器,并将您的初始表单标记更改为<form method="POST" action="http://127.0.0.1:5000/updateName">

您还应将所有id属性更改为name。这是因为id属性未发送到服务器。但是,name属性被发送并用于从服务器访问表单的信息。

这应该是一个很好的起点:

<form method="POST" action="http://127.0.0.1:5000/updateName">
  <p>ID of your Avenger:</p> <input type="number" name="ID" required> 
  <p>Name of your Avenger:</p> <input type="text" name="name" required> 
  <p>Post Code of your Avenger:</p> <input type="text" name="postcode" required> 
  <p>Date of Birth of your Avenger:</p> <input type="date" name="dateofbirth" required> 
  <p>Bank balance of your Avenger:</p> <input type="number" name="balance" required> 
  <p>Description of your Avenger:</p> <input type="text" name="description" required> 
  <button class="button1" type="button" id="hashButton">Submit</button>
</form>