簡體   English   中英

Laravel-在使用jQuery AJAX提交表單之前檢查用戶名是否已經存在

[英]Laravel - Check if username already exists before submitting form with jQuery AJAX

我已經填寫了很多領域的注冊表。 由於當我提交數據並且驗證器錯誤地重定向回時,某些輸入為空,並且用戶不得不浪費時間重新填充它們,因此我想實現一些前端驗證。 我堅持檢查用戶名是否已經在提交按鈕上使用,因為我不是AJAX專家。

在AuthController中,我創建了一個函數,該函數返回一個Json,該Json包含一個與數據庫中用戶名是否存在有關的響應。

class UserAuthController extends Controller
{
    public function isUserNameInUse( $username )
    {
        if (Auth::where('username', $username) != null){
            return [ 'is_used' => 1 ];
        }

            return [ 'is_used' => 0 ];
    }
}

在routes.php中有以下幾行:

Route::group([ 'as' => 'api', 'prefix' => 'api', 'namespace' => 'Api'], function () {

     Route::group([ 'as' => 'auth', 'prefix' => 'auth'], function () {
          Route::any('/is_username_in_use/{username}', [
            'as' => 'isUserNameInUse',
            'uses' => 'UserAuthController@isUserNameInUse']);


    });

});

視圖就是這樣(僅一部分形式):

<form action="{{ route('web.company.postSignup') }}" method="post" id="signup-form" class="form-horizontal">
            {!! csrf_field() !!}
            @include( 'errors.handler' )

                            <label for="username">
                                {{ _('Username*') }} </label>
                            <input type="text" class="form-control" name="username" id="username"
                                   value="{{ Input::old('username') }}" required>

                            <label for="password">
                                {{ _('Password*') }}
                            </label>

                            <input type="password" class="form-control" name="password" id="password"
                                   value="{{ Input::old('password') }}" onchange="form.confirmPassword.pattern = this.value;"
                                   required>

                            <label for="confirmPassword">
                                {{ _('Confirm Password*') }}
                            </label>

                            <input type="password" class="form-control" name="confirmPassword" id="confirmPassword" required>
                            <button class="btn btn-warning" id="submit-btn" type="submit">{{ _('Sign Up') }}</button>

</form> 

這是腳本,到目前為止,我僅嘗試記錄控制器的響應,但可以打印任何內容。

$(document).ready(function () {
    $('form#signup-form').submit(function () {
         var input_username = $('input[name=username]').val();
         console.log(input_username);

        $.getJSON('/api/auth/is_username_in_use/' + input_username, function (json) {

            console.log(json);


            });
            return false;
        });

    });

您應該更改return [ 'is_used' => 0 ]; return Response::json([ 'is_used' => 0 ]); 並添加use Response; 到您的控制器頂部。

如果用戶名正在使用中,則無需進行明確檢查。 您可以跳過此部分,而是在存儲用戶數據時進行相應驗證。

這樣的一個例子可能是

public function store(Request $request)
{
    $this->validate($request, [
        'username' => 'required|unique:users',
        'password' => 'required|confirmed'
    ]);

    // process your logic
}

這樣,如果驗證失敗,您將獲得一個包含錯誤消息的json響應對象。


請注意,如果您使用Laravel 5 ,這將起作用。 如果您使用的是4.* 請參閱文檔以獲取驗證部分。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM