我正在使用Flask模板创建一个表,其中的行由数据库填充。单击相应的编辑按钮时,我试图编辑这些行之一。当前,代码遍历数据库结果并填充表,并在每行上附加一个按钮。单击按钮后,将调用一个脚本,该脚本使用ajax调用我的python函数,该函数应该处理输入并将页面重定向到edit.html。一切都被正确调用,但是页面只是刷新并停留在table.html上,永不离开。下面是代码
@app.route('/tables.html', methods=['GET','POST'])
def questions():
table = list(getAllQuestions())
if(request.method == 'GET'):
return render_template('layouts/default.html',
content=render_template( 'pages/tables.html', value=table,), value=table)
def getAllQuestions():
conn = mysql.connect()
cursor = conn.cursor()
cursor.execute("SELECT * FROM tbl_questions")
data = cursor.fetchall()
data = data[:10]
return data
@app.route("/edit.html", methods=['GET', 'POST'])
def edit():
print("in edit")
form = RegisterForm(request.form)
return render_template('pages/edit.html', form=form)
@app.route('/background_process_test', methods=["GET", "POST"])
def background_process_test():
return redirect(url_for('edit'))
html和js
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type=text/javascript>
function clickfunction(value) {
console.log(value)
var resp = {
'value': value
}
console.log(resp)
$.ajax({
url: "/background_process_test",
type: 'POST',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(value),
dataType: 'json',
success: function(response) { alert(response); }
})
}
</script>
<div class="panel-header panel-header-sm">
</div>
<div class="content">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<h4 class="card-title"> Questions </h4>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table">
<thead class=" text-primary">
<th>
Question
</th>
<th>
Round
</th>
</thead>
<tbody>
{% for row in value %}
<tr id="table">
<td>{{row[0]}}</td>
<td>{{row[1]}}</td>
<td>{{row[2]}}</td>
<td><form><a><button class='editButtons' value={{row[0]}} onclick="clickfunction({{ row[0] }})">Edit</button></a></form> </td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
相应的输出是
in edit
127.0.0.1 - - [22/Mar/2020 12:58:03] "GET /edit.html HTTP/1.1" 200 -
127.0.0.1 - - [22/Mar/2020 12:58:04] "GET /tables.html HTTP/1.1" 200 -
运行所有这些命令后,“处于编辑状态”确实会记录到控制台,但是页面永远不会呈现。相反,表格页面只是刷新,似乎没有任何反应,正如您可以在编辑后的GET请求中告诉的那样。我确定我犯了一些愚蠢的错误,但这是我的第一个烧瓶项目(老实说也是第一个Web项目,从未使用过js)。如果需要澄清任何问题,或者需要更多代码来了解围绕该问题的情况,请告诉我,我会澄清