python网站创建005:数据交互
目标:本章讲解不同控件下, 数据在前端和后端之间的交互
控件有:
输入框
密码输入框
单选框
多选框
下拉框
多行文本框
不同控件中如何将数据传入后端?请看一下html代码
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>用户注册界面</title> </head> <body> <form> <!--账号输入控件--> <div>用户名:<input type="text" placeholder="请输入用户名" name="user"/></div> <div>密码:<input type="password" placeholder="请输入密码" name="pwd"/></div> <!--单选框--> <div>性别: 男<input type="radio" name="sex" value="男"/> 女<input type="radio" name="sex" value="女"/> </div> <!--多选框--> <div>爱好: 足球<input type="checkbox" name="爱好" value="1"/> 篮球<input type="checkbox" name="爱好" value="2"/> 兵乓球<input type="checkbox" name="爱好" value="3"/> </div> <!--下拉框--> <div>所在城市: <select name="city"> <option value="广西">广西</option> <option value="广东">广东</option> <option value="北京">北京</option> </select> </div> <!--多行为本框--> <div>其它信息: <textarea name="其它信息"></textarea> </div> <!--提交按钮--> <div><input type="submit" value="提交" /></div> </form> </body> </html>
然后在后端如何接收呢?数据接收四要素:(from表单、地址、传输方式、提交按钮)
然后就可以通过函数接收进来了
# 注册成功后的界面逻辑 @app.route('/register_list') def register_list(): # 如果你想获取整个表单内容,则可以通过该方式 datas = request.args # 如果你想单独获取某个数据,则可以通过该方式 user = request.args.get('user') # 用户名 pwd = request.args.get('pwd') # 密码 sex = request.args.get('sex') # 性别 hobby = request.args.getlist('爱好') # 爱好 city = request.args.get('city') # 城市 other = request.args.get('其它信息') # 其它 print(user,pwd,sex,hobby,city,other) # 然后将数据传入数据库(这里暂时用文件代替) line = "{}|{}|{}\n".format(user,pwd,sex) # 将数据以{用户名}|{密码}|{性别}这种数据格式展示 file = open('db.txt',mode='a',encoding='utf-8') # 创建文件流 file.write(line) # 写入文件 file.close() # 关闭文件 return '注册成功'
那如何将获取到的数据展示到网站界面呢?变懒了,直接赋代码
render_template:转到到html界面
redirect:重定向接口
python代码
# -*- coding:utf-8 -*- from flask import Flask, render_template, request, redirect # 创建 Flask 应用程序实例 app = Flask(__name__) # 注册界面逻辑 @app.route('/register') def register(): return render_template('register.html') # 注册成功后的界面逻辑 @app.route('/register_list') def register_list(): # 如果你想获取整个表单内容,则可以通过该方式 datas = request.args # 如果你想单独获取某个数据,则可以通过该方式 user = request.args.get('user') # 用户名 pwd = request.args.get('pwd') # 密码 sex = request.args.get('sex') # 性别 hobby = request.args.getlist('爱好') # 爱好 city = request.args.get('city') # 城市 other = request.args.get('其它信息') # 其它 # print(user, pwd, sex, hobby, city, other) # 然后将数据传入数据库(这里暂时用文件代替) line = "{}|{}|{}\n".format(user, pwd, sex) # 将数据以{用户名}|{密码}|{性别}这种数据格式展示 file = open('db.txt', mode='a', encoding='utf-8') # 创建文件流 file.write(line) # 写入文件 file.close() # 关闭文件 return redirect('/user_list') # 用户数据展示列表 @app.route('/user_list') def user_list(): # 从文件中读取数据:用户列表展示用 file_list = [] # 创建一个列表,用户存储从文件读取到的数据 file = open('db.txt', mode='r', encoding='utf-8') # 创建文件流 for i in file: file_list.append(i.strip()) # 去除开头和结尾的换行符, 再添加进列表 file.close() # 关闭文件 print('这是列表', file_list) # 从文件中读取数据:用户表格展示用 file_list_list = [] # 创建一个列表,用户存储从文件读取到的数据 file_table = open('db.txt', mode='r', encoding='utf-8') # 创建文件流 for t in file_table: ts = t.strip().split('|') # 去除开头和结尾的换行符, 然后再用 | 符号将数据分割开来 file_list_list.append(ts) # 再将数据添加进入列表 file.close() # 关闭文件 print('这是表格', file_list_list) # 将数据展示到前端界面 return render_template('user_list.html', v1=file_list, v2=file_list_list) # 运行应用程序 if __name__ == '__main__': app.run()
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>用户列表</title> </head> <body> <h1>用户列表</h1> <ul> {% for item in v1%} <li>{{item}}</li> {% endfor %} </ul> <h1>用户表格</h1> <table border="1"> <thead> <tr> <th>用户名</th> <th>密码</th> <th>性别</th> </tr> </thead> <tbody> {% for item in v2%} <tr> <td>{{item[0]}}</td> <td>{{item[1]}}</td> <td>{{item[2]}}</td> </tr> {% endfor %} </tbody> </table> </body> </html>
以上html代码运用到了for循环