ロゴ
HOME > jQuery・Javascript > 登録フォームにアカウント重複を確認するボタンを付ける

登録フォームにアカウント重複を確認するボタンを付ける

2014年03月11日

会員登録などを行うときに、使いたいアカウントが使用済かどうかを事前に確認出来るボタンがある登録フォームが有りますが、アレです。

サンプル

Javascript

 $(document).ready(function(){
   
  //エンター制御はお好みで
    $("#form").keypress(function(ev) {
      if ((ev.which && ev.which === 13) || (ev.keyCode && ev.keyCode === 13)) {
        return false;
      }
    });
   
  //重複確認ボタンを押したら
    //$("#button").click(function(){ //これペケ
    $(document).on('click','#button',function(e){ // クリックで実行 2014-07-24 修正

      var val = $("#account").val(); //入力した値を取得
      
        $.ajax({
           type: "POST",
           url: "07/07.php",
           data: "account="+val,
            beforeSend: function(){
              $("#message").html('<img src="../loader.gif" />');
            },
           success: function(xml){
               $(xml).find("item").each(function(){
                    var check = $(this).find("check").text();
                    if( check == 1 ){
                      $("#message").html('使用済です').css({"color":"red"});
                    } else {
                      $("#message").html('使用出来ます').css({"color":"blue"});
                    }
               });
           }
        });
    }); 
 });

ボタンを押したらテキストフォームの値をPHPに渡し、既存かどうかを確認したコールバックを受け取るって感じです。

PHP

<?php
 header("Content-type: application/xml");
 echo '<?xml version="1.0" encoding="UTF-8" ?> ' . "\n";
 
 
 //受け取った変数が使用済かどうかを確認
 //実際はDBなどへ問い合わせる事が多いと思う
    $account = htmlspecialchars($_POST['account'] , ENT_QUOTES , "UTF-8"); //特殊文字を HTML エンティティに変換する
    $array   = array('sample','hogehoge');
    $hit     = array_search($account, $array);
    if( $hit !== false ) :
      $check = true; //使用済ならTRUE
    endif;

 echo '<rss>'."\n"; 
 echo '  <item xml:space="preserve">'."\n"; 
 echo '      <check>'.$check.'</check>'."\n"; 
 echo '  </item>'."\n"; 
 echo '</rss>'."\n"; 

これが付いていると確かに便利ですが、簡単にチェック出来てしまうので、使用済みと出たアカウントは存在している理由で・・つまりログインアカウントがバレるって事で、これって実際どうなんだろう?といつも思います。実際は認証したあとに、誕生日認証とか秘密のキーワード認証とか噛ませるのですが、それにしてもPOSTした時にもう一度確認が必要ですし、結局同じじゃ・・と思ったり。