完成注册功能

Posted loe05

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了完成注册功能相关的知识,希望对你有一定的参考价值。

  1. js文件: onclick函数return True时才提交表单,return False时不提交表单。
  2. html文件:
    1. <form>中设置 action和method="post"
    2. <input> 中设置 name
  3. 主py文件中:
    1. from flask import  request, redirect, url_for
    2. @app.route(‘/regist/‘, methods=[‘GET‘, ‘POST’])

def regist():

   if request.method == ‘GET‘:

        return render_template(‘regist.html‘)

   else:

        username = request.form.get(‘username’)#获取form中的数据

        判断用户名是否存在

        存到数据库中

        redirect重定向到登录页

技术分享图片
from flask import Flask, render_template, url_for,request,redirect
from flask_sqlalchemy import SQLAlchemy
import config
from functools import wraps
from  datetime import datetime
app = Flask(__name__)
app.config.from_object(config)
db = SQLAlchemy(app)


class User(db.Model):
    __tablename__ = ‘user‘
    id = db.Column(db.Integer,primary_key=True,autoincrement=True)
    username = db.Column(db.String(20),nullable=False)
    password = db.Column(db.String(20),nullable=False)
    nickname = db.Column(db.String(50),nullable=False)
    db.create_all()
class Question(db.Model):
    __tablename__ = ‘user‘

# # 增加
# user = User(username=‘mis1114‘,password = ‘mis1114‘)
# db.session.add(user)
# db.session.commit()
#
# # 查询
# user =User.query.filter(User.username ==‘mis1114‘).first()
#
# # 删除
# user =User.query.filter(User.username ==‘mis1114‘).first()
# print(user.username,user.password)
# db.session.delete(user)
# db.session.commit()
#
# # 修改
# user =User.query.filter(User.username ==‘mis1114‘).first()
# user.password=‘111111‘
# print(user.username,user.password)
# db.session.commit()



@app.route(‘/‘)
def index():
    context={‘qusstion‘:Question.query.order_by(‘-creat_time‘).all()}
    return render_template(‘index.html‘,**context)


@app.route(‘/register‘,methods=[‘GET‘,‘POST‘])
def register():
    if request.method==‘GET‘:
        return render_template(‘register.html‘)
    else:
        username=request.form.get(‘username‘)
        passward=request.form.get(‘passward‘)
        nickname=request.form.get(‘nickname‘)
        user=User.query.filter(User.username==username).first()
    if user:
        return ‘username existed‘
    else:
        user=User(username=username,passward=passward,nickname=nickname)
        db.session.add(user)
        db.session.commit()
        return redirect(url_for(‘load‘))

@app.route(‘/load‘,methods=[‘GET‘,‘POST‘])
def load():
    if request.method == ‘GET‘:
        return render_template(‘register.html‘)

if __name__ == ‘__main__‘:
    app.run()
技术分享图片
技术分享图片
function fnRegister() {
    var oUname = document.getElementById("uname");
    var oError = document.getElementById("error_box");
    var oUiphone = document.getElementById("uiphone");
    var oUpass = document.getElementById("upass");
    var oUpass1 = document.getElementById("upass1");
    // var oUpass = document.getElementById("upass").value;
    // var oUpass1 = document.getElementById("upass1").value;
    if (oUpass1!=oUpass){
    document.getElementById("error_box"),innerHTML="两次密码不一致";
    return false;}
   return true;
//    oError.innerHTML = "<br>"
//
//    if (oUname.value.length < 6 || oUname.value.length > 12) {
//        oError.innerHTML = "用户名6-12";
//        return;
//    } else if ((oUname.value.charCodeAt(0) >= 48) && (oUname.value.charCodeAt(0) <= 57)) {
//        oError.innerHTML = "第一位只能是字母";
//        return;
//    } else for (var i = 0; i < oUname.value.length; i++) {
//        if (oUname.value.charCodeAt(i) < 48 || (oUname.value.charCodeAt(i) > 57) && (oUname.value.charCodeAt(i) < 97) || oUname.value.charCodeAt(i) > 122) {
//            oError.innerHTML = "只能是字母或数字";
//            return;
//        }
//    }
//    if (oUpass.value.length < 6 || oUpass.value.length > 12) {
//        oError.innerHTML = "密码6-12位";
//        return;
//    }
//    if (oUpass1.value != oUpass.value) {
//        oError.innerHTML = "rewrite your PIN";
//        return;
//    }
//    // if (oUpass!= oUpass1) {
//    //     document.getElementById("error_box").innerHTML = "两次密码不一样";
//    //     return;
//    // }
   window.alert("注册成功")
}
技术分享图片
技术分享图片
{% extends ‘base.html‘ %}
{% block title %}
    注册
{% endblock %}
{% block head %}
       <link type="text/css" rel="stylesheet" href="{{ url_for(‘static‘,filename=‘css/register.css‘) }}">
    <script src="{{ url_for(‘static‘,filename=‘js/load.js‘) }}"></script>
{% endblock %}


{% block main %}
    <div><h1>打开代码的世界</h1></div>
    <div class="aa">
        <script>document.write("loading....")</script>
    </div>
    <div class="flex-container">

        <div class="box">

            <h2>welcome to register</h2>

            <div class="input_box">
                请输入账号 <input id="uname" name="uname"type="text" placeholder="write down your name"></div>
           <div class="input_box">
                请输入昵称 <input id="nickname" name="nickname" type="text" placeholder="write down your nickname"></div>

            <br>
            <div class="input_box">
                请输入密码 <input id="upass" type="password" placeholder="write down your PIN"></div>
              <div class="input_box">
                再输入密码 <input id="upass1" type="password" placeholder="write down your PIN"></div>
            <br>
            <div id="error_box"><br></div>
            <div class="input_box">
                <button onclick="fnRegister()">register</button>
            </div>

        </div>
    </div>
{% endblock %}
技术分享图片

 

以上是关于完成注册功能的主要内容,如果未能解决你的问题,请参考以下文章

解决方案电影标题中缺少代码的片段,完成挑战更多[关闭]

带有固定按钮的片段

从零开始配置vim(27)——代码片段

从零开始配置vim(27)——代码片段

从零开始配置vim(27)——代码片段

完成注册功能