使用 Flask (Python) 从 MySQL 数据库中获取 "Some" 数据
Fetch "Some" data from MySQL Database using Flask (Python)
我刚开始用 Flask 制作 "Student Database Project"。我已经使用 flask_mysqldb 模块建立了一个 MySQL 数据库。我还向其中插入了一些学生数据。但我想获取特定学生的数据(姓名、年级、phone 号码、地址、电子邮件等)。我应该怎么做?请帮助我,因为我是 Flask 的新手并且 MySQL。这是我的代码:
from flask import Flask,render_template, redirect, url_for, request, jsonify
from flask_mysqldb import MySQL
app = Flask(__name__)
app.config['SECRET_KEY'] = 'ILUVTOFART'
app.config['MYSQL_HOST'] = 'localhost'
app.config['MYSQL_USER'] = 'root'
app.config['MYSQL_PASSWORD'] = ''
app.config['MYSQL_DB'] = 'student_db'
mysql = MySQL(app)
@app.route("/add_s_data", methods=["GET","POST"]) #This is the page for adding student information to DB
def handle_s_data():
if request.method == "POST":
cur = mysql.connection.cursor()
sid = request.form.get('id', False) # Student ID
name = request.form.get('name', False) # Full Name
f_name = request.form.get('fname', False) # Father's Name
m_name = request.form.get('mname', False) # Mother's Name
clas = request.form.get('class', False) # His grade/class
roll = request.form.get('roll', False) # His roll number
section = request.form.get('section', False) # His class section
dob = request.form.get('dob', False) # Date of Birth
join = request.form.get('join', False) # Admission date
phone = request.form.get('phone', False) # Phone number
address = request.form.get('address', False) # Address
sequence = (sid, name, f_name, m_name, clas, roll, section, dob, join, phone, address)
formula = "INSERT INTO student_data (id, name, f_name, m_name, class, roll, section, dob, joindate, phone, address) VALUES (%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,%s )"
cur.execute(formula,sequence)
mysql.connection.commit()
return str(sequence) + " Done!"
return render_template('add_s_data.html')
#I want to fetch these data from the database and show them on the page. I know how to use Jinja2 Variables, but how do I fetch the data?
@import url('https://fonts.googleapis.com/css?family=Josefin+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC&display=swap');
@import url('https://fonts.googleapis.com/css?family=Lato&display=swap');
@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');
*{
margin: 0;
padding: 0;
box-sizing: border-box;
list-style: none;
text-decoration: none;
font-family: 'Josefin Sans', sans-serif;
}
body{
background-color: #f3f5f9;
}
.wrapper{
display: flex;
position: relative;
}
.wrapper .sidebar{
width: 240px;
height: 100%;
background: #0080ff;
padding: 30px 0px;
position: fixed;
}
.wrapper .sidebar h2{
margin-left: 15px;
padding-top: 05px;
padding-bottom: 05px;
color: white;
font-family: 'Noto Sans TC', sans-serif;
-webkit-text-stroke: 0.5px black;
}
.wrapper .sidebar ul li{
padding: 15px;
border-bottom: 1px solid #bdb8d7;
border-bottom: 1px solid rgba(0,0,0,0.05);
border-top: 1px solid rgba(255,255,255,0.05);
}
.wrapper .sidebar ul li a{
color: white;
display: block;
}
.wrapper .sidebar ul li a .fas{
width: 25px;
}
.wrapper .sidebar ul li:hover{
background-color: #0f52ba;
}
.wrapper .sidebar ul li:hover a{
color: #fff;
}
.wrapper .sidebar .social_media{
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
display: flex;
}
.wrapper .sidebar .social_media a{
display: block;
width: 40px;
background: #594f8d;
height: 40px;
line-height: 45px;
text-align: center;
margin: 0 5px;
color: #bdb8d7;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.home {
background: #0080ff;
}
.add{
background: #0f52ba;
}
.wrapper .main_content{
width: 100%;
margin-left: 200px;
}
.wrapper .main_content .header{
padding: 20px;
background: #fff;
color: #717171;
border-bottom: 1px solid #e0e4e8;
}
.wrapper .main_content .info{
margin: 20px;
color: #717171;
line-height: 25px;
}
.wrapper .main_content .info div{
margin-bottom: 20px;
}
@media (max-height: 500px){
.social_media{
display: none !important;
}
}
.id{
font-size: 30px;
margin-top: 5%;
margin-left:20%;
}
.id input{
margin-left: 16.5%;
width: 30%;
height: 5;
font-size: 30px;
}
.name{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.name input{
width: 30%;
height: 5;
font-size: 30px;
margin-left: 11.5%;
}
.fname{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.fname input{
width: 30%;
height: 5;
margin-left: 1%;
font-size: 30px;
}
.mname{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.mname input{
width: 30%;
height: 5;
font-size: 30px;
}
.class{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.class input{
width: 30%;
height: 5;
font-size: 30px;
margin-left: 12.5%;
}
.roll{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.roll input{
width: 30%;
height: 5;
font-size: 30px;
margin-left: 14%;
}
.section{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.section input{
width: 30%;
height: 5;
font-size: 30px;
margin-left: 9.5%;
}
.dob{
position: absolute;
margin-left: 65%;
top: 18.5%;
font-size: 30px;
}
.dob input{
width: 50%;
font-size: 30px;
height: 1;
}
.joining{
position: absolute;
margin-left: 65%;
top: 29.5%;
font-size: 30px;
}
.joining input{
margin-left: 2%;
width: 50%;
font-size: 30px;
height: 1;
}
.phone{
position: absolute;
margin-left: 65%;
top: 42.5%;
font-size: 30px;
}
.phone input{
margin-left: 10%;
width: 50%;
font-size: 30px;
height: 1;
}
.address{
position: absolute;
margin-left: 65%;
top: 54.5%;
font-size: 30px;
}
.address input{
margin-left: 16%;
width: 51%;
font-size: 30px;
height: 1;
}
button{
font-size: 20px;
border: 1px solid black;
background: lightblue;
color: white;
margin-left: 77%;
position: absolute;
top: 70%;
width: 100px;
height: 50px;
border-radius: 8px;
}
<!DOCTYPE html>
<html lang="eng">
<head>
<meta charset="utf-8">
<title>I am Ahnaf</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/bootstrap.min.css')}}">
<link rel="stylesheet" type="text/css" href="../static/css/add_s_data.css">
<link rel="stylesheet" type="text/css" href="../static/fontawsome/css/all.css">
</head>
<body>
<!-- Sidebar Section -->
<div class="wrapper">
<div class="sidebar">
<h2>Ahnaf's SDMS</h2>
<ul>
<li class="home"><a href="/dashboard"><i class="fas fa-home"></i>Home</a></li>
<li class="search"><a href=""><i class="fas fa-search"></i>Search Data</a></li>
<li class="add"><a href="/add_s_data"><i class="fas fa-users"></i>Add Data</a></li>
<li class="modify"><a href="#"><i class="fas fa-edit"></i>Modify Data</a></li>
<li class="delete"><a href="#"><i class="fas fa-user-minus"></i>Delete Data</a></li>
<li class="report"><a href="#"><i class="fas fa-flag"></i>Add Student Report</a></li>
<li class="present"><a href="#"><i class="fas fa-address-card"></i>ID Card Maker</a></li>
<li class="exam"><a href="#"><i class="fas fa-pen"></i>Exams</a></li>
<li class="events"><a href="#"><i class="fas fa-calendar-week"></i>Events</a></li>
<li class="contact"><a href="#"><i class="fas fa-address-book"></i>Contact</a></li>
</ul>
</div>
</div>
<div class="choice">
<p style="color:blue;position: absolute; top:2%;margin-left: 35%;font-size: 30px;">Student</p>
<hr style="position: relative; margin-top: 4%; margin-left: 29%; width: 20%">
<div style="position:absolute;top:0;border-left:1px solid #000;height:50px; margin-left: 57%;"></div>
<a style="color: black;position: absolute; top:2%;margin-left: 70%;font-size: 30px;"href="/add_t_data">Teacher</a>
</div>
<div class="form">
<form action="/add_s_data" method='POST'>
<div class="id">
<label>ID:</label>
<input type="text" name="id" ><br>
</div>
<div class="name">
<label>Name:</label>
<input type="text" name="name" ><br>
</div>
<div class="fname">
<label>Father's Name:</label>
<input type="text" name="fname" ><br>
</div>
<div class="mname">
<label>Mother's Name:</label>
<input type="text" name="mname" ><br>
</div>
<div class="class">
<label>Class:</label>
<input type="text" name="class" ><br>
</div>
<div class="roll">
<label>Roll:</label>
<input type="text" name="roll" ><br>
</div>
<div class="section">
<label>Section:</label>
<input type="text" name="section" ><br>
</div>
<div class="dob">
<label>Date of Birth:</label>
<input type="date" name="dob" ><br>
</div>
<div class="joining">
<label>Joining Date:</label>
<input type="date" name="join" ><br>
</div>
<div class="phone">
<label>Phone No:</label>
<input type="text" name="phone" ><br>
</div>
<div class="address">
<label>Address:</label>
<input type="text" name="address" ><br>
</div>
<button type="submit" value="Submit" >Submit</button>
</form>
</div>
<script type="text/javascript">
</script>
</body>
</html>
感谢您的方便。
以下是您可以做到的方法。
@app.route("/user/<int:id>")
def user(id):
cur = mysql.connection.cursor()
cur.execute("""SELECT * FROM student_data WHERE id = %s""", (id,))
user = cur.fetchone()
return render_template('user.html', user = user)
里面user.html
<!DOCTYPE html>
<html lang="eng">
<head>
<meta charset="utf-8">
<title>User : {{ user.name }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/bootstrap.min.css')}}">
<link rel="stylesheet" type="text/css" href="../static/css/add_s_data.css">
<link rel="stylesheet" type="text/css" href="../static/fontawsome/css/all.css">
</head>
<body>
<div class="user">
<p>ID: {{ user.id }}</p>
<p>ID: {{ user.name }}</p>
<p>...</p>
</div>
</body>
</html>
我建议你去检查一下Flask-SQLAlchemy
,Flask-WTForms
它们将帮助你更好地管理数据库和表单。
我刚开始用 Flask 制作 "Student Database Project"。我已经使用 flask_mysqldb 模块建立了一个 MySQL 数据库。我还向其中插入了一些学生数据。但我想获取特定学生的数据(姓名、年级、phone 号码、地址、电子邮件等)。我应该怎么做?请帮助我,因为我是 Flask 的新手并且 MySQL。这是我的代码:
from flask import Flask,render_template, redirect, url_for, request, jsonify
from flask_mysqldb import MySQL
app = Flask(__name__)
app.config['SECRET_KEY'] = 'ILUVTOFART'
app.config['MYSQL_HOST'] = 'localhost'
app.config['MYSQL_USER'] = 'root'
app.config['MYSQL_PASSWORD'] = ''
app.config['MYSQL_DB'] = 'student_db'
mysql = MySQL(app)
@app.route("/add_s_data", methods=["GET","POST"]) #This is the page for adding student information to DB
def handle_s_data():
if request.method == "POST":
cur = mysql.connection.cursor()
sid = request.form.get('id', False) # Student ID
name = request.form.get('name', False) # Full Name
f_name = request.form.get('fname', False) # Father's Name
m_name = request.form.get('mname', False) # Mother's Name
clas = request.form.get('class', False) # His grade/class
roll = request.form.get('roll', False) # His roll number
section = request.form.get('section', False) # His class section
dob = request.form.get('dob', False) # Date of Birth
join = request.form.get('join', False) # Admission date
phone = request.form.get('phone', False) # Phone number
address = request.form.get('address', False) # Address
sequence = (sid, name, f_name, m_name, clas, roll, section, dob, join, phone, address)
formula = "INSERT INTO student_data (id, name, f_name, m_name, class, roll, section, dob, joindate, phone, address) VALUES (%s,%s,%s,%s,%s,%s,%s,%s,%s,%s,%s )"
cur.execute(formula,sequence)
mysql.connection.commit()
return str(sequence) + " Done!"
return render_template('add_s_data.html')
#I want to fetch these data from the database and show them on the page. I know how to use Jinja2 Variables, but how do I fetch the data?
@import url('https://fonts.googleapis.com/css?family=Josefin+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC&display=swap');
@import url('https://fonts.googleapis.com/css?family=Lato&display=swap');
@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');
*{
margin: 0;
padding: 0;
box-sizing: border-box;
list-style: none;
text-decoration: none;
font-family: 'Josefin Sans', sans-serif;
}
body{
background-color: #f3f5f9;
}
.wrapper{
display: flex;
position: relative;
}
.wrapper .sidebar{
width: 240px;
height: 100%;
background: #0080ff;
padding: 30px 0px;
position: fixed;
}
.wrapper .sidebar h2{
margin-left: 15px;
padding-top: 05px;
padding-bottom: 05px;
color: white;
font-family: 'Noto Sans TC', sans-serif;
-webkit-text-stroke: 0.5px black;
}
.wrapper .sidebar ul li{
padding: 15px;
border-bottom: 1px solid #bdb8d7;
border-bottom: 1px solid rgba(0,0,0,0.05);
border-top: 1px solid rgba(255,255,255,0.05);
}
.wrapper .sidebar ul li a{
color: white;
display: block;
}
.wrapper .sidebar ul li a .fas{
width: 25px;
}
.wrapper .sidebar ul li:hover{
background-color: #0f52ba;
}
.wrapper .sidebar ul li:hover a{
color: #fff;
}
.wrapper .sidebar .social_media{
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
display: flex;
}
.wrapper .sidebar .social_media a{
display: block;
width: 40px;
background: #594f8d;
height: 40px;
line-height: 45px;
text-align: center;
margin: 0 5px;
color: #bdb8d7;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.home {
background: #0080ff;
}
.add{
background: #0f52ba;
}
.wrapper .main_content{
width: 100%;
margin-left: 200px;
}
.wrapper .main_content .header{
padding: 20px;
background: #fff;
color: #717171;
border-bottom: 1px solid #e0e4e8;
}
.wrapper .main_content .info{
margin: 20px;
color: #717171;
line-height: 25px;
}
.wrapper .main_content .info div{
margin-bottom: 20px;
}
@media (max-height: 500px){
.social_media{
display: none !important;
}
}
.id{
font-size: 30px;
margin-top: 5%;
margin-left:20%;
}
.id input{
margin-left: 16.5%;
width: 30%;
height: 5;
font-size: 30px;
}
.name{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.name input{
width: 30%;
height: 5;
font-size: 30px;
margin-left: 11.5%;
}
.fname{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.fname input{
width: 30%;
height: 5;
margin-left: 1%;
font-size: 30px;
}
.mname{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.mname input{
width: 30%;
height: 5;
font-size: 30px;
}
.class{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.class input{
width: 30%;
height: 5;
font-size: 30px;
margin-left: 12.5%;
}
.roll{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.roll input{
width: 30%;
height: 5;
font-size: 30px;
margin-left: 14%;
}
.section{
font-size: 30px;
margin-top: 3%;
margin-left:20%;
}
.section input{
width: 30%;
height: 5;
font-size: 30px;
margin-left: 9.5%;
}
.dob{
position: absolute;
margin-left: 65%;
top: 18.5%;
font-size: 30px;
}
.dob input{
width: 50%;
font-size: 30px;
height: 1;
}
.joining{
position: absolute;
margin-left: 65%;
top: 29.5%;
font-size: 30px;
}
.joining input{
margin-left: 2%;
width: 50%;
font-size: 30px;
height: 1;
}
.phone{
position: absolute;
margin-left: 65%;
top: 42.5%;
font-size: 30px;
}
.phone input{
margin-left: 10%;
width: 50%;
font-size: 30px;
height: 1;
}
.address{
position: absolute;
margin-left: 65%;
top: 54.5%;
font-size: 30px;
}
.address input{
margin-left: 16%;
width: 51%;
font-size: 30px;
height: 1;
}
button{
font-size: 20px;
border: 1px solid black;
background: lightblue;
color: white;
margin-left: 77%;
position: absolute;
top: 70%;
width: 100px;
height: 50px;
border-radius: 8px;
}
<!DOCTYPE html>
<html lang="eng">
<head>
<meta charset="utf-8">
<title>I am Ahnaf</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/bootstrap.min.css')}}">
<link rel="stylesheet" type="text/css" href="../static/css/add_s_data.css">
<link rel="stylesheet" type="text/css" href="../static/fontawsome/css/all.css">
</head>
<body>
<!-- Sidebar Section -->
<div class="wrapper">
<div class="sidebar">
<h2>Ahnaf's SDMS</h2>
<ul>
<li class="home"><a href="/dashboard"><i class="fas fa-home"></i>Home</a></li>
<li class="search"><a href=""><i class="fas fa-search"></i>Search Data</a></li>
<li class="add"><a href="/add_s_data"><i class="fas fa-users"></i>Add Data</a></li>
<li class="modify"><a href="#"><i class="fas fa-edit"></i>Modify Data</a></li>
<li class="delete"><a href="#"><i class="fas fa-user-minus"></i>Delete Data</a></li>
<li class="report"><a href="#"><i class="fas fa-flag"></i>Add Student Report</a></li>
<li class="present"><a href="#"><i class="fas fa-address-card"></i>ID Card Maker</a></li>
<li class="exam"><a href="#"><i class="fas fa-pen"></i>Exams</a></li>
<li class="events"><a href="#"><i class="fas fa-calendar-week"></i>Events</a></li>
<li class="contact"><a href="#"><i class="fas fa-address-book"></i>Contact</a></li>
</ul>
</div>
</div>
<div class="choice">
<p style="color:blue;position: absolute; top:2%;margin-left: 35%;font-size: 30px;">Student</p>
<hr style="position: relative; margin-top: 4%; margin-left: 29%; width: 20%">
<div style="position:absolute;top:0;border-left:1px solid #000;height:50px; margin-left: 57%;"></div>
<a style="color: black;position: absolute; top:2%;margin-left: 70%;font-size: 30px;"href="/add_t_data">Teacher</a>
</div>
<div class="form">
<form action="/add_s_data" method='POST'>
<div class="id">
<label>ID:</label>
<input type="text" name="id" ><br>
</div>
<div class="name">
<label>Name:</label>
<input type="text" name="name" ><br>
</div>
<div class="fname">
<label>Father's Name:</label>
<input type="text" name="fname" ><br>
</div>
<div class="mname">
<label>Mother's Name:</label>
<input type="text" name="mname" ><br>
</div>
<div class="class">
<label>Class:</label>
<input type="text" name="class" ><br>
</div>
<div class="roll">
<label>Roll:</label>
<input type="text" name="roll" ><br>
</div>
<div class="section">
<label>Section:</label>
<input type="text" name="section" ><br>
</div>
<div class="dob">
<label>Date of Birth:</label>
<input type="date" name="dob" ><br>
</div>
<div class="joining">
<label>Joining Date:</label>
<input type="date" name="join" ><br>
</div>
<div class="phone">
<label>Phone No:</label>
<input type="text" name="phone" ><br>
</div>
<div class="address">
<label>Address:</label>
<input type="text" name="address" ><br>
</div>
<button type="submit" value="Submit" >Submit</button>
</form>
</div>
<script type="text/javascript">
</script>
</body>
</html>
感谢您的方便。
以下是您可以做到的方法。
@app.route("/user/<int:id>")
def user(id):
cur = mysql.connection.cursor()
cur.execute("""SELECT * FROM student_data WHERE id = %s""", (id,))
user = cur.fetchone()
return render_template('user.html', user = user)
里面user.html
<!DOCTYPE html>
<html lang="eng">
<head>
<meta charset="utf-8">
<title>User : {{ user.name }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/bootstrap.min.css')}}">
<link rel="stylesheet" type="text/css" href="../static/css/add_s_data.css">
<link rel="stylesheet" type="text/css" href="../static/fontawsome/css/all.css">
</head>
<body>
<div class="user">
<p>ID: {{ user.id }}</p>
<p>ID: {{ user.name }}</p>
<p>...</p>
</div>
</body>
</html>
我建议你去检查一下Flask-SQLAlchemy
,Flask-WTForms
它们将帮助你更好地管理数据库和表单。