Drawer Tornado Combat (3)--register

Source: Internet
Author: User

Knowledge Point application: Tag binding event, jquery get user value-"Ajax send data-" Background routing system-"business logic processing-" ORM data operation-"write return-" Ajax callback function Receive--"page effect display

First step: We are going to bind an onclick event to the front-end Get Captcha button--Send a message verification code
    • Find the Views under home index.html find tags, onclick=sendcode (this)
    • Define events, get mailboxes, send AJAX requests

The jquery code is as follows:

        function Sendcode (this) {            var email = $ (#xiang). Val ();            $.ajax ({                URL: '/send_code ',                type: ' POST ',                data:{em:email},                success:function (ARG) {                    Console.log (ARG);                },                error:function () {                }            })        }
    • After sending the request, the background will receive the data, first to the routing system to configure the URL

    • Once configured, the next step is the business logic to find the controllers account to write the Sendcodehandler class
Class Sendcodehandler (Baserequesthandler):    def post (Self,*args,**kwargs):        #定制信息        ret = {"Status": True, " Data ":", "Error": ""}        Email = self.get_argument (' em ', None)        if email:            #如果有值, generate a random verification code, and send the mailbox            code = Commons.randon_code ()            message.email ([email,],code)            #创建session连接            conn = chouti_orm.session ()            # Generates a temporary table object and writes to the temp table,            obj = chouti_orm. Sendcode (Email=email,code=code,stime=datetime.datetime.now ())            conn.add (obj)            conn.commit ()            Self.write (Json.dumps (ret))        else:            #如果没有, change False status, add error message            ret["status"] = False            ret["error"] = "Mailbox Format error"            Self.write (Json.dumps (ret))
    • In the process above, we will define a Sendcode class as a temporary table in chouti_orm.py because of temporary tables that are temporarily stored.

Class Sendcode (Base):    __tablename__ = "Sendcode"    #注册时验证码信息    nid = Column (Integer, Primary_key=true, autoincrement=true)    email = column (string (+), index=true)    code = Column (String (6))    # status = Column ( Integer)  #状态码, 0 means unregistered, 1 successful, 2 pull black    #验证码的有效时间    stime = Column (TIMESTAMP)  #发送时间
    • After the Ajax callback function receives the data, the JS processing displays the due effect on the page

Step Two: Click Register, carry the information to verify
    • Binds the Submitregister event to the registered label, and binds a specific class to the tag to which the message is to be submitted
    • event, register status change, send Ajax request
        function Submitregister (THS) {$ (ths). Children (': eq (0) '). AddClass (' hide ');            $ (THS). addclass (' Not-allow '). Children (': EQ (1) '). Removeclass (' hide '); Send AJAX Requests//Get all content entered by the user (define a specific class or custom attribute) var post_dict = {} $ (". Regiter_temp"). each (                function () {var input_val = $ (this). Val ();                var Name_val = $ (this). attr ("name");            Post_dict[name_val]=input_val;            }) Console.log (post_dict);                Send Ajax request $.ajax ({URL: "/register", type: "POST", Data:post_dict,                    Success:function (ARG) {console.log (ARG);                    ARG is the string var obj = Json.parse (ARG);                    if (obj.status) {//Registration succeeds---jump (signed in Status--session implementation) Location.href = "/index";   }else{alert (obj.error);                 }})//Completed after $ (ths). Removeclass (' Not-allow '). Children (':            EQ (1) '). AddClass (' hide ');        $ (THS). Children (': eq (0) '). Removeclass (' hide '); }
    • According to the information submitted by the user to the temporary table (Verification Code table) to filter, registration successful session to save the login status

class Registerhandler (baserequesthandler): Def post (self, *args, **kwargs): ret = {"Status": True, "Data": "", "Error": ""} #获取用户输入的所有内容 #code = Sendcode matches the mailbox #注册 #conn. A DD (obj) #conn. commit () conn = Chouti_orm.session () #创立连接 #根据用户提交过来的验证码和邮箱 to the Temp table to filter r = Conn . query (Chouti_orm.            Sendcode). Filter (code=123,email= ' 111 '). First () if not r: #如果没有, return error message ret[' status '] = False ret["error"] = "Mailbox Authenticode Error" Self.write (Json.dumps (ret)) Else: #临时表里有, registration is successful, instance user information object, with new To the UserInfo table, obj = Chouti_orm. UserInfo () conn.add (obj) conn.commit () #session保存用户登陆状态 self.session["Is_login "] = True #保存用户 self.session[' username ') = ' user-entered user name ' Self.write (json.dumps (ret)) 
    • The AJAX callback function receives the data, the registration succeeds jumps to the homepage, and displays the login status

You may have doubts, as if the registration of the mailbox has not been registered to verify, right, here can be in the mailbox of the label definition onblur event-Send an AJAX request, to the background to userinfo the table to detect and return the results can be

Drawer Tornado Combat (3)--register

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.