xoyqaw
Last Updated: February 25, 2016
·
2.261K
· runexec
81609937c20aeab3598aea56f1f4f022

Nice Form Validation

<h1>Register.js</h1>

/*
Ryan Kelker
Remember to check the values on the backend. Never trust the client!
*/

function username() { return $('#username').val(); }
function password() { return $('#password').val(); }
function email() { return $('#email').val(); }

function status(str_msg) {
    s = document.getElementById('status');
    s.innerHTML = str_msg;
}
function validForm() {

    // clear status
    status('');

    if (email() == '') {
    status('Invalid E-mail');
    }
    if (password() == '') {
    status('Invalid Password');
    }
    if (username() == '') {
    status ('Invalid Username');
    }

    return ($('#status').text() == '')?1:0;
}


function loggedIn() {
    document.location = '/';
}

function register() {
    if(validForm()) {
    $.post('/view/register',
           {"username": username(),
        "password": password(),
        "email": email()},
           function (data, okay) {
           if(okay == 'success') {
               //
               // Login Works
               // return new session_id in json on sucess
               //
               if(data['session_id'] !== undefined) {
               loggedIn();
               }else{
               status('Failed Registration Attempt!');
               }
           }else{ 
               status('Error:'+data+' : \r\n'+okay); 
           }
           });
    }
}

<h1>The Clojure Page - you will need to add some things.</h1>

(ns webapi.views.page.register
         (:require [webapi.views.common :as common]
             [webapi.json :as json]
             [webapi.token :as token])
         (:use [noir.core :only [defpage]]))

(defpage [:post "/view/register"] {:keys [username
                                          password
                                          email
                                          csrf-token] :as values}
  {:status 200
   :body (json/encode
          ;; session id set on success login
          (json/item "session_id"
                     (token/new)))})


(defpage [:get "/view/register"] []
  (common/layout
   [:script {:type "text/javascript"
             :src "/js/register.js"}]
   [:a {:id "status"
        :name "status"}]
   [:br
    [:label "Username: "]
    [:input {:type "text"
             :id "username"
             :name "username"
             :placeholder "Username"}]]
   [:br
    [:label "Password: "]
    [:input {:type "text"
             :id "password"
             :name "password"
             :placeholder "Password"}]]
   [:br
    [:label "E-mail: "]
    [:input {:type "text"
             :id "email"
             :name "email"
             :placeholder "E-mail"}]]
   [:br
    [:input {:type "submit"
             :id "register-button"
             :name "register-button"
             :text "register-button"
             :value "register-button"
             :onclick "javascript:register();"}]]))
Say Thanks
Respond

2 Responses
Add your response

333
545da9c5299e131c632f0914de5bd6d5

A couple suggestions:
* Instead of return ($('#status').text() == '')?1:0; you can do return !!$('#status').text(); which is the same thing.

  • Be aware of falsy/truthy values, this if (email() == '') is the same as if (!email()) and if(data['session_id'] !== undefined) can be expressed as if(data['session_id'])
over 1 year ago ·
334
81609937c20aeab3598aea56f1f4f022

@elclanrs Thanks!! This is not the same thing. For example !! == (! (! value)),so your solution is not the same as my ternary if-else expression. Your solution is not false, and my solution is if-else. Thanks a bunch for your help. I'll remember to use this where appropriate. Also, I prefer (x) ? : ; as opposed to !! because, this style of if-else is almost universal in the popular languages of today.

over 1 year ago ·