7. Tùy chỉnh thông báo lỗi, Tùy chỉnh thuộc tính validation (ok)

https://viblo.asia/p/tap-20-validation-laravel-GrLZDWAEKk0

Tùy chỉnh thông báo lỗi (Customizing the error message)

Bạn có thể tùy chỉnh thông báo lỗi bằng method messages trong form request. Method này sẽ trả về mảng thuộc tính/rule và các thông báo lỗi tương ứng. Chẳng hạn với ví dụ trên, mình sẽ định nghĩa thêm method messages cho form request StorePost.

public function messages()
{
    return [
        'title.required' => 'Tiêu đề bài viết không được bỏ trống',
        'body.required' => 'Nội dung bài viết không được bỏ trống'
    ];
}

Việc này thật sự không quá khó khăn, bạn chỉ cần chú ý đến các key của mảng. Chúng ta sẽ sử dụng cú pháp name_field.name_rule hoặc chỉ name_rule cho key. Ok, bây giờ hãy test xem nào.

Nếu như một rule có cấu trúc thông báo lỗi giống nhau cho tất cả request thì bạn có thể cân nhắc sử dụng key name_rule.

public function messages()
{
    return [
        'required' => ':attribute không được bỏ trống'
    ];
}

Ta sẽ thu được kết quả:

Lưu ý: Các tùy chỉnh này chỉ có hiệu lực trong phạm vi một form request nhất định.

Ví dụ đã hoàn thành:

C:\xampp\htdocs\blog\routes\web.php

Route::get('post/create', 'PostController@create');
Route::post('post', 'PostController@store');

C:\xampp\htdocs\blog\app\Http\Controllers\PostController.php

public function create() {
    return view('create_post');
  }
  /**
   * Store a newly created resource in storage.
   *
   * @param  \Illuminate\Http\Request  $request
   * @return \Illuminate\Http\Response
   */
  public function store(StorePost $request) {
    $validated = $request->validated();
  }

C:\xampp\htdocs\blog\app\Http\Requests\StorePost.php

<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

class StorePost extends FormRequest {
  /**
   * Determine if the user is authorized to make this request.
   *
   * @return bool
   */
  public function authorize() {
    return true;
  }

  /**
   * Get the validation rules that apply to the request.
   *
   * @return array
   */
  public function rules() {
    return [
      'title' => 'required|max:100',
      'body'  => 'required|min:50',
    ];
  }
  public function withValidator($validator) {
    $validator->after(function ($validator) {
      $validator->errors()->add('field', 'Something is wrong with this field!');
    });
  }
  public function messages() {
    return [
      // 'title.required' => 'Tiêu đề bài viết không được bỏ trống',
      // 'body.required'  => 'Nội dung bài viết không được bỏ trống',
      'required' => ':attribute không được bỏ trống'
    ];
  }
  public function attributes() {
    return [
      'title' => 'Tiêu đề bài viếts',
      'body' => 'Nội dung bài viếts'
    ];
  }
}

C:\xampp\htdocs\blog\resources\views\create_post.blade.php

<h1>Create new post</h1>
<form action="/post" method="POST">
    @csrf
    <div>
        <p>Title</p>
        <input type="text" name="title">
    </div>
    <div>
        <p>Body</p>
        <textarea name="body" cols="30" rows="10"></textarea>
    </div>
    <br>
    <div>
        <button type="submit">Create</button>
    </div>
</form>
<script src="http://localhost/library/jquery/jquery.min.js"></script>
<script>
    $('form').submit(function(e) {
        e.preventDefault();
        $.ajax({
            url: '/post',
            type: 'POST',
            data: {
                _token: $('input[name=_token]').val(),
                title: $('input[name=title]').val(),
                body: $('textarea[name=body]').val()
            }, success: function(res) {
                //
            }, error: function(error) {
                console.log(error);
            }
        })
    })
</script>

5. Tùy chỉnh thuộc tính validation (Customizing the validation attribute)

Nhìn kết quả trên khá ok nhưng các bạn sẽ cảm thấy không chuyên nghiệp cho lắm, vì :attribute mặc định sẽ lấy name của request được gửi đến để làm thông báo lỗi. Nhưng Laravel đã cung cấp cho chúng ta method attributes để thay đổi thiết lập đó.

public function attributes()
{
    return [
        'name_field' => 'Label field',
        // ...
    ];
}

Áp dụng cho ví dụ trên, các bạn chỉ việc định nghĩa thêm method attributes như sau:

public function attributes()
{
    return [
        'title' => 'Tiêu đề bài viết',
        'body' => 'Nội dung bài viết'
    ];
}

Một kết quả không thể tốt hơn được nữa:

Lưu ý: Các tùy chỉnh này chỉ có hiệu lực trong phạm vi một form request nhất định.

Ví dụ đã hoàn thành:

C:\xampp\htdocs\blog\routes\web.php

Route::get('post/create', 'PostController@create');
Route::post('post', 'PostController@store');

C:\xampp\htdocs\blog\app\Http\Controllers\PostController.php

public function create() {
    return view('create_post');
  }
  /**
   * Store a newly created resource in storage.
   *
   * @param  \Illuminate\Http\Request  $request
   * @return \Illuminate\Http\Response
   */
  public function store(StorePost $request) {
    $validated = $request->validated();
  }

C:\xampp\htdocs\blog\app\Http\Requests\StorePost.php

<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

class StorePost extends FormRequest {
  /**
   * Determine if the user is authorized to make this request.
   *
   * @return bool
   */
  public function authorize() {
    return true;
  }

  /**
   * Get the validation rules that apply to the request.
   *
   * @return array
   */
  public function rules() {
    return [
      'title' => 'required|max:100',
      'body'  => 'required|min:50',
    ];
  }
  public function withValidator($validator) {
    $validator->after(function ($validator) {
      $validator->errors()->add('field', 'Something is wrong with this field!');
    });
  }
  public function messages() {
    return [
      'title.required' => 'Tiêu đề bài viết không được bỏ trống',
      'body.required'  => 'Nội dung bài viết không được bỏ trống',
      // 'required' => ':attribute không được bỏ trống'
    ];
  }
}

C:\xampp\htdocs\blog\resources\views\create_post.blade.php

<h1>Create new post</h1>
<form action="/post" method="POST">
    @csrf
    <div>
        <p>Title</p>
        <input type="text" name="title">
    </div>
    <div>
        <p>Body</p>
        <textarea name="body" cols="30" rows="10"></textarea>
    </div>
    <br>
    <div>
        <button type="submit">Create</button>
    </div>
</form>
<script src="http://localhost/library/jquery/jquery.min.js"></script>
<script>
    $('form').submit(function(e) {
        e.preventDefault();
        $.ajax({
            url: '/post',
            type: 'POST',
            data: {
                _token: $('input[name=_token]').val(),
                title: $('input[name=title]').val(),
                body: $('textarea[name=body]').val()
            }, success: function(res) {
                //
            }, error: function(error) {
                console.log(error);
            }
        })
    })
</script>

Last updated