因此,我一直在尝试使用python中的flask和Sqlite创建一个简单的CRUD应用程序(T0-do应用程序),我确实得到了输出,一切都按预期运行,但表(数据库)显示在同一个浏览器选项卡中,我希望用户表单和表位于单独的选项卡中
class Todo(db.Model):
sno = db.Column(db.Integer, primary_key=True)
title = db.Column(db.String(200), nullable=False)
desc = db.Column(db.String(500), nullable=False)
date_created = db.Column(db.DateTime, default=datetime.utcnow)
def __repr__(self) -> str:
return f"{self.sno} - {self.title}"
@app.route('/', methods=['GET', 'POST'])
def hello_world():
if request.method=='POST':
title = request.form['title']
desc = request.form['desc']
todo = Todo(title=title, desc=desc)
db.session.add(todo)
db.session.commit()
allTodo = Todo.query.all()
return render_template('index.html', allTodo=allTodo)
@app.route('/show')
def products():
allTodo = Todo.query.all()
print(allTodo)
return 'this is products page'
@app.route('/update/<int:sno>', methods=['GET', 'POST'])
def update(sno):
if request.method=='POST':
title = request.form['title']
desc = request.form['desc']
todo = Todo.query.filter_by(sno=sno).first()
todo.title = title
todo.desc = desc
db.session.add(todo)
db.session.commit()
return redirect("/")
todo = Todo.query.filter_by(sno=sno).first()
return render_template('update.html', todo=todo)
@app.route('/delete/<int:sno>')
def delete(sno):
todo = Todo.query.filter_by(sno=sno).first()
db.session.delete(todo)
db.session.commit()
return redirect("/")
if __name__ == "__main__":
app.run(debug=True, port=8000)
这是我的html代码
<div class="container my-3">
<h2>Add a Todo</h2>
<form action="/" method="POST">
<div class="mb-3">
<label for="title" class="form-label">Todo Title</label>
<input type="text" class="form-control" name="title" id="title" aria-describedby="emailHelp">
</div>
<div class="mb-3">
<label for="desc" class="form-label">Todo Description</label>
<input type="text" class="form-control" name="desc" id="desc">
</div>
<button type="submit" class="btn btn-dark">Submit</button>
</form>
</div>
<div class="container my-3">
<h2>Your Todos</h2>
{% if allTodo|length == 0 %}
<div class="alert alert-dark" role="alert">
No Todos found. Add your first todo now!
</div>
{% else %}
<table class="table">
<thead>
<tr>
<th scope="col">SNo</th>
<th scope="col">Title</th>
<th scope="col">Description</th>
<th scope="col">Time</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
{% for todo in allTodo %}
<tr>
<th scope="row">{{loop.index}}</th>
<td>{{todo.title}}</td>
<td>{{todo.desc}}</td>
<td>{{todo.date_created}}</td>
<td>
<a href="/update/{{todo.sno}}" type="button" class="btn btn-outline-dark btn-sm mx-1">Update</button>
<a href="/delete/{{todo.sno}}" type="button" class="btn btn-outline-dark btn-sm mx-1">Delete</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endif %}
</div>
输出:-I want this below table to appear in a new tab but not in the same tab as the form
2条答案
按热度按时间e7arh2l61#
制作index.html的副本并将其重命名为show.html。从此模板中删除第一个div容器。将@app.route('/show')中的return替换为与'/' route中的return相同,并将模板更改为show.html。导航到127.0.0.1:8000/show,您应该会看到您的表。
sshcrbum2#
你需要有两个独立的模板和两个独立的路径。看起来你对Flask架构没有基本的了解。如果你在同一个模板中有表单和表格,当然它们会呈现在同一个页面上。
使用表代码创建一个新模板,并拥有一个呈现新模板的新路由。