从SQLAlchemy Flask中删除的行或所有行更新JSON文件

时间:2019-03-20 14:43:09

标签: javascript json flask flask-sqlalchemy

我有一个HTML表,其中填充了JSON文件中的数据。 JSON文件通过Flask-SQLAlchemy从SQLite数据库获取数据。该表称为“测试”,其中包含名称,电子邮件和ID的列。

当我删除所有数据进行测试时。它给了我一个空的清单。 JSON文件读取Test表,它应该为空,HTML表也应该为空,但是它们仍然显示与我删除的相同的数据。 知道为什么会这样吗?任何帮助将不胜感激。

在Flask中创建的JSON文件。测试是使用Flask-SQLAlchemy创建的表

@app.route("/user_test_json")
def user_test_json():


    user_test_json = []

    test = Test.query.all()


    if test != []:

        length = len(test)

        name = ["name" for i in range(length)]
        email = ["email" for i in range(length)]
        questions = ["question" for i in range(length)]

        timestamps = ["timestamp" for i in range(length)]

        edit = ["edit" for i in range(length)]
        for i in range(length):

            user_test_json.append({"id": i+1, 
                                   name[i]: test[i].name, 
                                   email[i]: test[i].email, edit[i]: "Edit_{}".format(i+1),
                                  questions[i]: "Ask_Question", 
                                 timestamps[i]: test[i].timestamp })
        return jsonify(user_test_json)

    else:


        return None

由上面的user_test_json视图函数创建的JSON数据。

[
  {
    "edit": "Edit_1", 
    "email": "Akira@gmail.com", 
    "id": 1, 
    "name": "Akira", 
    "question": "Ask_Question", 
    "timestamp": "2019-03-20 13:47:08"
  }, 
  {
    "edit": "Edit_2", 
    "email": "ryo@gmail.com", 
    "id": 2, 
    "name": "ryo", 
    "question": "Ask_Question", 
    "timestamp": "2019-03-20 13:47:29"
  }, 
  {
    "edit": "Edit_3", 
    "email": "jessica@gmail.com", 
    "id": 3, 
    "name": "Jessica", 
    "question": "Ask_Question", 
    "timestamp": "2019-03-20 13:52:24"
  }, 
  {
    "edit": "Edit_4", 
    "email": "john@gmail.com", 
    "id": 4, 
    "name": "john", 
    "question": "Ask_Question", 
    "timestamp": "2019-03-20 13:52:36"
  }, 
  {
    "edit": "Edit_5", 
    "email": "peter@gmail.com", 
    "id": 5, 
    "name": "peter", 
    "question": "Ask_Question", 
    "timestamp": "2019-03-20 13:52:52"
  }
]

当我运行一些Test代码时,清空列表。

from models import Test, db
Test.query.all()

#OUTPUT SOME USERS IN TEST TABLE

[<Test 'alita'>, <Test 'bob'>, <Test 'Jessica'>, <Test 'jim'>]

Test.query.delete()
db.session.commit()

test = Test.query.all()
test
#OUTPUT EMPTY LIST

[]

我的HTML / JS

<!DOCTYPE html>
<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title></title>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="robots" content="noindex, nofollow">
  <meta name="googlebot" content="noindex, nofollow">
  <meta name="viewport" content="width=device-width, initial-scale=1">

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="icon" href="/static/images/neptune-icon2.png" type="image/png" sizes="16x16">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script   src="http://code.jquery.com/jquery-3.3.1.min.js"   integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="   crossorigin="anonymous"></script>
<script   src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"   integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU="   crossorigin="anonymous"></script>


<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

<script>
    type="text/javascript"
    src="//code.jquery.com/jquery-1.9.1.js"
</script>

<title>Test 1</title>

<style>


table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}



.test-table-header{


    font-weight: bold;
    text-align:center;
}

</style>

</head>
<body>






<center>
<table id="table-test">
<tr><th>Numbers</th><th>Link</th></tr>

</table>

<br>
<table id="test-table">
<tr><th class= "test-table-header">ID</th>
<th class= "test-table-header">Name</th>
<th class= "test-table-header">Email</th>
<th class= "test-table-header">Edit</th>
<th class="test-table-header">Question</th>
<th class="test-table-header">TimeStamp</th>
</tr>



</table>

</center>



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script   src="http://code.jquery.com/jquery-3.3.1.min.js"   integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="   crossorigin="anonymous"></script>
<script   src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"   integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU="   crossorigin="anonymous"></script>



<script type="text/javascript">



$.get("/user_test_json").then(function(data){



    var table = document.getElementById("test-table");

    for(var i =0; i < data.length; i++){



        table.innerHTML += "<td style='text-align:center;' class='ids' id='row-id'>" +
        data[i]["id"] +"</td><td style='text-align:center;'>" + 
        data[i]["name"] + "</td><td =style='text-align:center;'>" + data[i]["email"]+
        "</td><td style='text-align:center;'><a href='#' class='popper' data-popbox='pop1'>"+ 
        data[i]["edit"] + 
        "</a></td><td><button id='Approved' type='submit'>" + data[i]["question"] 
        + "</button></td><td style='text-align:center;'>" +data[i]["timestamp"] + "</td>";
    }




});

</script>

</body>
</html>

0 个答案:

没有答案