JQUERY AJAX laravel 5.2ユーザー名可用性確認

Question

私はlaravel 5.2の登録フォームの同じページでユーザー名の可用性をチェックしたいと思います。 JQuery AJAXを使ってどうやってやるの？その場所にキーが入力されているかどうか確認したい。私はちょうど初心者です。助けてください？ここで

Answer 1

が私のコードで、

は、実際に私はlaravel 4.2バージョンでこれをやったが、laravel 5. *で{{と}}ブラケットを使用するようにちょうどsyntacレベルの変更があるコードレベルで何らかの変更があっwont'tブレードのファイルlarvel 5は、あなたのためを検証するためにjqueryの検証方法を使用する必要があります非常に最初{!!と!}}

を使用して、あなたがいることを、これはあなたに良いアイデアを与えるだろう、このlink

の表情を持つことができますどのようにjQueryのバリデーションを使用するかを検証する方法はとても使いやすく、jqueryといくつかのバリデーションメソッドをロードするだけです。ここで

は私のビューファイルです：あなたが気づいた私はremote: { }メソッドを使用している場合

<!-- Change the "src" attribute according to your installation path --> 
<script src="vendor/jquery-validation/dist/jquery.validate.min.js"></script> 
<form action="{{ URL::to('signup/create') }}" method="POST" class="signup-form" id='signup-form1' enctype="multipart/form-data"> 

        <div class="container"> 
         <div class="row form-div"> 
          <div class="row"> 
           <div class="col-sm-6"> 
            <div class="form-group"> <span class="skew"><span class="inside"><span class="icon-mwtMsg custum-font-icon"> </span></span></span> <span class="skew"> <span class="inside"> 
             <input type="email" placeholder="Email Address" name="email" id="regemail"> 
             </span> </span> 
             <div class="clearfix"></div> 
             <div class="erroremail register-error-block"></div> 
            </div> 
           </div> 
           <div class="col-sm-6"> 
            <div class="form-group"> <span class="skew"><span class="inside"><span class="icon-mwtTag custum-font-icon"> </span></span></span> <span class="skew"> <span class="inside"> 
             <input type="text" placeholder="Gamer Tag" name="gamertag" id="gamertag"> 
             </span> </span> 
             <div class="clearfix"></div> 
             <div class="errortag register-error-block"></div> 
            </div> 
           </div> 
          </div> 
         </div> 
        </div> 
        <p class="Create-account-btn"> 
         <button class="btn btn-skew btn-red" type="submit" name="register" id="register-btn"><span>Create Account</span></button> 
        </p> 
       </form> 

今すぐ上記のスクリプトでは、この申し込みフォーム

$("#signup-form1").validate({ 
        errorElement : 'div', 
        errorLabelContainer: '.errorTxt', 
        ignore: [], 
        rules: { 
         email:{ 
          required:true, 
          email:true, 
          remote: { 
           url: "signup/checkemail", 
           type: "post", 
           data: {email: $("input[email='email']").val(), _token: $('input[name=_token]').val()}, 
           dataFilter: function (data) { 
            var json = JSON.parse(data); 
            if (json.msg == "true") { 
             return "\"" + "Email address already in use" + "\""; 
            } else { 
             return 'true'; 
            } 
           } 
          } 
         }, 
         gamertag: { 
          required: true, 
          alphanumeric:true 
         }, 
        }, 
        messages: { 
         email: { 
          required: "Email address is required.", 
          email: "Please enter valid email address.", 
          remote: "Email address already in use!" 
         }, 
         gamertag: { 
          required: "Gamer Tag is required.", 
          alphanumeric: "Gamer Tag must contain alphanumeric string." 
         } 
        }, 
        errorPlacement: function(error, element) { 
         //$(element).closest('.skew').append() 
         if (element.attr("name") == "email") { 
          $(".erroremail").append(error); 
         } 
         else if (element.attr("name") == "gamertag") { 
          $(".errortag").append(error); 
         } 
         else { 
            error.append($('.errorTxt span')); 
         } 
        }, 
        invalidHandler: function (event, validator) { //display error alert on form submit  

        }, 
        highlight: function (element) { // hightlight error inputs 
         $(element).closest('.skew').addClass('has-error'); // set error class to the control group 
        }, 
        unhighlight: function (element) { // revert the change done by hightlight 
         $(element).closest('.skew').removeClass('has-error'); // set error class to the control group 
        }, 
        success: function (label) { 
         label.closest('.skew').removeClass('has-error'); // set success class to the control group 
        }, 
        submitHandler: function(form) { 
         //console.log(form); 
         $("#signup-form1").submit(); 
         // Adding a New Post 
        } 
       }); 

ためにjqueryの検証を追加するものもしそれがデータベースに存在するかどうかを確認することもできます。

と私はここでは、この

のようないくつかのことである私のコントローラ内のいくつかのコードをしたことを実行するためには、電子メールが存在しているかいないかどうかを確認するために私のコントローラの機能です。 JSON形式で真と偽のメッセージを返すために起こっている

public function postCheckemail(){ 
     //$user = Register::where('email', Input::get('email'))->get(); 
     $user = DB::table('users')->where('email', Input::get('email')); 
     if($user->count()) { 
      return Response::json(array('msg' => 'true')); 
     } 
     return Response::json(array('msg' => 'false')); 
    } 

。

：

これは、あなたがこのjqueryの検証方法をたくないならば、あなたはlaravel自体here

レッツによって与えられた検証機能を使用することができます今、Ajaxで

だったが、これはあなたの表示ファイルであると言います

<form action="{{ URL::to('signup/create') }}" method="POST" class="signup-form" id='signup-form1' enctype="multipart/form-data"> 

        <div class="container"> 
         <div class="row form-div"> 
          <div class="row"> 
           <div class="col-sm-6"> 
            <div class="form-group"> <span class="skew"><span class="inside"><span class="icon-mwtMsg custum-font-icon"> </span></span></span> <span class="skew"> <span class="inside"> 
             <input type="email" placeholder="Email Address" name="email" id="regemail"> 
             </span> </span> 
             <div class="clearfix"></div> 
             <div class="erroremail register-error-block"></div> 
            </div> 
           </div> 
           <div class="col-sm-6"> 
            <div class="form-group"> <span class="skew"><span class="inside"><span class="icon-mwtTag custum-font-icon"> </span></span></span> <span class="skew"> <span class="inside"> 
             <input type="text" placeholder="Gamer Tag" name="gamertag" id="gamertag"> 
             </span> </span> 
             <div class="clearfix"></div> 
             <div class="errortag register-error-block"></div> 
            </div> 
           </div> 
          </div> 
         </div> 
        </div> 
        <p class="Create-account-btn"> 
         <button class="btn btn-skew btn-red" type="submit" name="register" id="register-btn"><span>Create Account</span></button> 
        </p> 
       </form> 

ここではコントローラが有効になっています。

public function postCreate(){ 
     $validator = Validator::make(array(
       'email' => Input::get('email'), 
       'gamertag' => Input::get('gamertag'), 
      ),  
      array(    
       'email' => 'required|email|unique:users', 
       'gamertag' => 'required|min:3' 
      )); 

      if ($validator->fails()) 
      {  
       $messages = $validator->messages()->first();    
       //return Redirect::to('signup')->with('error_message', $messages); 
       $data['success'] = false;  
       $data['message'] = $messages; 
      } 
      else 
      {   
       //Your insert Query here to store the data in database 
      } 

      return Response::json($data); 
    } 

それはそれです！

いつでもどこにいてもお気軽にお問い合わせください。