2014-01-16 3 views
0

Я работаю над веб-приложением, и я хотел бы выполнить проверку электронной почты на моей стороне сервера с помощью javascript, но я немного смущен относительно того, как структурировать мой документ и как заставить все это работать.Проверка подлинности на стороне сервера с узлом и Express

Я использую node/Express, и я использую Jade для своих шаблонов. Я хочу, чтобы моя страница входа в систему пользователя собиралась проверять электронную почту, как только пользователь щелкает из окна (используя вызовы AJAX). У меня есть папка lib, где у меня есть файл validation.js, где я намерен иметь весь мой код проверки.

У меня также есть файл navigation.js, где я использую все мои вызовы AJAX.

validation.js

function checkEmail(userEmail) { 

    var email = userEmail 
    var emailFilter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; 

    if (!emailFilter.test(email.value)) { 
    //alert('Please provide a valid email address'); 
    email.focus; 
    return false; 
} 
function checkPassword(userPassword){ 
    var password = userPassword; 
    var passwordFilter = /^[[email protected]#$%^&*]{6,16}$/ 

    if (!passwordFilter.test(password.value)){ 
     password.focus; 
     return false; 
    } 
} 

navigation.js

$(document).ready(function() { 

    console.log("DOCUMENT IS READY!"); 

    var viewsWrapper = $("#views-wrapper"); 
    var loginButton = $("#login-button"); 
    var registerButton = $("#register-button"); 

    // Login Link 
    // TODO: Unclear if needed 
    $("ul li.login").click(function() { 
     $.get('/login', function(data) { 
      viewsWrapper.html(data); 
     }); 
    }); 


    // Login Button 
    loginButton.click(function(e) { 


     // TODO: Input validation needed 


     var loginData = { username: $("#username").val(), password: $("#password").val() }; 

     $("#username").blur(function() { 
      if (!checkEmail(username)){ 
       alert("Handler for .blur() called."); 
      } 
     }); 
     $("#username").blur(function() { 
      if (!checkPassword(password)){ 
       alert("Handler for .blur() called."); 
      } 
     }); 

     e.preventDefault(); 
     $.post('/login', loginData, function(data) { 
      $('body').html(data); 
     }); 
    }); 

..... (Still code after this but not relevant) 

Я отредактировал мой код так, что я использовал некоторые о комментариях снизу. Он все еще не работает, потому что я не получаю предупреждающее сообщение. Есть ли это делать, когда я звоню:

 if (!checkPassword(username)){ 
      alert("Handler for .blur() called."); 
     } 

Am Я на самом деле проходит в имени пользователя, когда я делаю это, или я должен использовать в loginData каким-то образом?

Ваша помощь приветствуется.

ответ

0

Если это HTML 5-страничка, вы можете воспользоваться встроенной проверкой подлинности электронной почты. http://www.the-art-of-web.com/html/html5-form-validation/ Unfotunatly это будет отличаться от указанного вами регулярного выражения, но писать регулярное выражение электронной почты сложнее, чем изначально появляется.

Я бы также предположил, что, поскольку у вас уже есть проверки, написанные на javascript, вы можете применять те же проверки в javascript на самой веб-странице. Это сэкономит вам потенциальную задержку, вызвав вызов ajax.

Что касается применения валидации при нажатии, вы можете использовать событие размытия, которое jQuery предоставляет удобный метод для использования. http://api.jquery.com/blur/

0

Вы можете проверить электронную почту после того, как пользователь нажмет из входных почтового ящика с помощью focusout или размытости события JQuery:

$('#txtEmail').focusout(function(){ 
    checkEmail(); 
}); 
+0

Я сделал некоторые изменения на мой вопрос, и вышеуказанных методы. Когда я запускаю код, я не получаю предупреждение, должен ли я ссылаться на loginData? Я также изменил validation.js, чтобы методы принимали параметры имени пользователя и пароля. –

+0

Я бы передал $ ("# password"). Val() для checkPassword. Значение пароля, скорее всего, не определено. Кроме того, наличие $ ("# username"). Blur внутри обработчика события click не имеет смысла. Это отдельные события: размытие; по щелчку. Похоже, у вас есть обработчики событий .blur, которые вы могли бы комбинировать –

Смежные вопросы