我在烧瓶中有简单的数据库
class Task(db.Model):
__tablename__ = 'task'
id = db.Column(db.Integer, primary_key=True, autoincrement=True)
task = db.Column(db.Text)
tasks = [
Task(task="1+2+3"),
Task(task="2+3+4"),
Task(task="2+3+4+5"),
Task(task="2+3+4+5+6"),
Task(task="2+3+4+5+7"),
Task(task="2+3+4+5+8")
]
for tsk in tasks:
db.session.add(tsk)
db.session.commit()
@app.route('/')
def index():
query_from_task = Task.query.all()
return render_template('index.html',
query_from_task=query_from_task)
list_of_ids =[]
@app.route('/like', methods=['POST'])
def like():
ddd = True
print(ddd)
return jsonify({'like': ddd})
我的目标是通过单击按钮将任务中的 id 添加到列表中。我知道如何在不使用 Flask 的情况下制作它,但这不是很方便。我尝试使用 ajax 来做到这一点:
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
crossorigin="anonymous"></script>
<script>
$(document).ready(function () {
$("#button_1").click(function (e) {
e.preventDefault();
$.ajax({
type: "POST",
url: "/like",
success: function (result) {
console.log(result["like"]);
if (result["like"]) {
console.log("if like");
$("#button_1").addClass("is-danger");
$("#button_1").removeClass("is-success");
}
else {
console.log("if not like");
$("#button_1").addClass("is-success");
$("#button_1").removeClass("is-danger");
}
},
error: function (result) {
console.log(result);
}
});
});
});
</script>
<title>Hello, world!</title>
{%- for k in query_from_task %}
<div class="space">
{{k.task }}
<button id="button_1" class="button {% if ddd %}is-danger{% else %}is-success{% endif %}" value="1">Info</button>
</div>
{%- endfor %}
问题是只有一个按钮处于活动状态。我应该如何解决我的问题?