2017-06-07 27 views
0

私のjqueryでajax呼び出しを使用して、ブレードからコントローラにユーザー入力を送信しています。個々の入力フィールドのラーバル検証

は私が

<div class="col-md-3"> 
    <input type="text" class="form-control inputProfilePage" id="fname" name="fname" placeholder="First Name" 
      value="{{ Auth::user()->fname }}"> 
    </div> 
    <div class="col-md-3"> 
    <input type="text" class="form-control inputProfilePage" id="lname" name="lname" placeholder="Last Name" 
      value="{{ Auth::user()->lname }}"> 
    </div> 

fnameには、ファーストネームのためにある入力フィールドを持っている、LNAMEは私がコール

$('.selectProfilePage').change(function(){ 
      var val = $(this).val(); 
      var field = $(this).attr('id'); 
      updateProfilePage(val, field); 
     }); 

フィールドを持っている私のjqueryのでは姓

のフィールドの名前です、valはユーザーが入力に入力した値です。

updateProfilePageは、AJAX呼び出し私のルートで

function updateProfilePage(val, field) { 
      $.ajaxSetup({ 
       headers: { 
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
       } 
      }); 
      $.ajax({ 
       type: 'POST', 
       url: '/userprofilepage', 
       data: { 
        val: val, 
        field: field 
       }, 
       success: function (msg) { 
        console.log("Profile page has been updated:" + val); 
       }, 
       error: function (msg) { 
        console.log("Profile page has not been updated:" + msg); 
       } 
      }); 
     } 

が、これは私の店の関数を呼び出すファイルです。私が苦労しているのは、ユーザーが入力した価値を検証する方法です。ここに私のコントローラの私の店のメソッドです

public function store(Request $request) 
    { 
      $this->validate($request, [ 
       'val' => 'alpha' 
      ]); 
    } 

私はアルファベットではないものを入力する場合、私は私のブレードにエラーメッセージを印刷したいです。

私は私のブレードに次のコードを追加しましたが、エラーはまだ

<div class="alert alert-error"> 
    <ul> 
     @foreach($errors->all() as $error) 
      <li>{{$error}}</li> 
     @endforeach 
    </ul> 
</div> 

は、だから私は間違って何をやっているが表示されませんか?ユーザーが姓のファーストネームの入力にアルファベット以外のものを入力した場合、私のブレードにエラーが表示されるようにしたい。

答えて

1

ブレードの構文は、ページがロードされるたびにサーバーによって生成されます。アラートボックスにエラーを追加するには、ページが再ロードされないようにajaxでフォームを送信します。 )

function updateProfilePage(val, field) { 
      $.ajaxSetup({ 
       headers: { 
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
       } 
      }); 
      $.ajax({ 
       type: 'POST', 
       url: '/userprofilepage', 
       data: { 
        val: val, 
        field: field 
       } 
      }).done(function() { 
       $('.alert').find('ul').append('<li>Profile page has been updated:' + data + '</li>'); 
      }).fail(function() { 
       $('.alert').find('ul').append('<li>Profile page has not been updated:' + data + '</li>'); 
      }).always(function (e) { 
       console.log(e); 
      }); 
     } 
関連する問題