AJAXがnode.jsと連携するようにする

Question

私は登録ページに対してこのPOSTリクエストを持っています。これは、ユーザ名がすでに別のユーザーによって使用されているかどうかを確認し：

router.post ('/register', function(req, res) { 
User.findOne({username: req.body.username}, function(err, existingUser) { 
    if(existingUser) { 
     req.flash('errors1', req.body.username + ' already exists.'); 
     return res.redirect('/register'); 
    } 
//some more code down here if the username is unique 

をそしてここで（私はEJSを使用しています）の形式である：入力したユーザー名がない場合は、基本的に

<form method="POST" action="/register"> 
    <% if (errors1.length > 0) { %> 
     <div class='form-group has-error'> 
      <label for="username">Stock Ticker</label> 
      <input type="text" name="username" class="form-control" id="username"/> 
      <span class="help-block"><%= errors1 %></span> 
     </div> 

一意である場合は、フォームのすぐ下にユーザー名を使用できないことを知らせるメッセージが表示されます。しかし、このメッセージはの後にと表示され、ユーザーはSUBMITボタンを押しただけです。

これにAJAXを組み込むにはどうすればよいですか？以前はAJAXを使用したことがなく、ドキュメンテーションやチュートリアルを見てきましたが、このコードにAJAXを組み込む方法については頭を悩ますことができません。

Answer 1

入力制御は多分次のコードは、この希望、を集中失うときあなたがチェックを行い、この要求をトリガするための新しいAPIを作成する必要があります。

server.js：

router.post ('/check_username', function(req, res) { 
    //CODE:check your username 
}) 

を

HTML：

<div class='form-group has-error'> 
     <label for="username">Stock Ticker</label> 
     <input type="text" name="username" class="form-control" id="username"/> 
     <span class="help-block"><%= errors1 %></span> 
</div> 

JS（jQueryの）：

$("#username").focusout(function(){ 
     var value = $("#username").val(); 
     //CODE:send the request and display result; 
     $.post('/check_username',{username:value},function(data){ 
     //CODE:handle result 
     }) 
    });