入力チェックとかの話

[PHP]簡単な入力チェック用のJSとかとか

目的：テキスト欄に入力された値を裏側で確認してみる

主な流れ

1. 文字の入力
2. フォーカスを外したら通信
3. 裏側で入力内容の確認
4. 照合結果を返す

手順

1 入力フォームの作成

  <form id="edit_form" class="form-horizontal" name="form-regist" enctype="multipart/form-data" method="post" action="/edit" novalidate="novalidate">
    <div class="form-group">
      <div class="col-sm-9">
        <input type="text" class="form-control" id="test_input" placeholder="確認用" name="test" value="">
      </div>
    </div>
  </form>

（行の最後にJQueryが読み込めるようにしとこう。）

2 javascriptを作成
ファイル名「test.js」を作成

//照合のajax
$('#test_input').blur(function(){
  var hostUrl= '/edit/check';
  var test_text = $('#test_input').val();

  if(test_text == ''){
    return;
  }

  //まず入力可能文字列か調べる。
  var reg = new RegExp("^[0-9a-zA-Z-]+$");
  if (!reg.test(test_text)){
    swal("使用できない文字が入力されています。", "a~z,A~Z,0~9,-,_ のみ入力可能です。", "warning");
    $('#test_input').val("");
  }

  $.ajax({
    url: hostUrl,
    type:'POST',
    dataType: 'json',
    data : {test_text : test_text},
    timeout:10000,
  }).done(function(data) {
    console.log(data);
    if(data.count == 0) {
      //被りなければ何もしない
      return;
    }else{
      //inputの値消す
      swal("", "再度入力してください。", "warning");
      $('#test_input').val("");
    }
  }).fail(function(XMLHttpRequest, textStatus, errorThrown) {
    console.log(XMLHttpRequest);
    console.log(textStatus);
    console.log(errorThrown);
  })
});

3 PHP側で他のデータ等と照合したいと時
*FuelPHP

<?php

/**
  * @package Api
  */
class Controller_Edit extends \Controller
{
  /**
    * @access  public
    * @return  status msg
    * 入力照合
    */
  public function action_check()
  {
    try {
      //コールバック用形式
      header('Content-type: application/json; charset=UTF-8');

      //javascriptからpostパラメータを取得
      $search_key = array(
          'text' => Input::post('test_text', ''),  //入力値
      );

      //DBとかと照合する、、、
      
      //戻り値
      echo json_encode(array(
        'status'  => 0,              //0:正常処理
        'msg'     => 'success',  		//メッセージ内容
      ));

      exit; //処理終了

    //例外処理
    } catch (\Exeption $e) {
      //エラーログ
      \Log::error( 'APIエラー:' . 'text:' . $search_key['text'] . $e->getMessage());
      //戻り値
      echo json_encode(array(
        'status'  => 2,               //異常終了
        'msg'     => 'fatal error ',  //メッセージ内容
      ));
        exit;   //処理終了
    }
  }

これで入力チェックは完成です。この機能を使ってデータベースの値との照合とかにも使えると思います。

以上