Ошибка 422 при попытке проверить форму Laravel через AJAX

Я пытался использовать класс Validator Larave. Я могу заставить его работать при отправке формы в обычном режиме, но когда я отправляю через AJAX, я получаю сообщение об ошибке:

POST http://localhost/dashboard 422 (Unprocessable Entity)

Даже когда я пробую простую версию своей формы:

<div class = "container">
    <div class = "row justify-content-center">
        <div class = "col-6">
            @if ($errors->any())
                @foreach($errors->all() as $error)
                    <div>
                        {{ $error }}
                    </div>
                @endforeach
            @endif
            <form action = "/dashboard" method = "post" id = "test-form"> 
                @csrf
                <input type = "text" name = "name" id = "name" />
                <input type = "submit">
            </form>
        </div>
    </div>
</div>

<script>
    $('#test-form').on('submit', function(e)
    {
        e.preventDefault();
        $.post($(this).attr('action'), $(this).serialize())
        .fail(function(data)
        {
            console.info(data);
        })
        .done(function(res)
        {
            alert('done');
        });
    });
</script>

Мой контроллер:

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class DashboardController extends Controller
{
    public function index()
    {
        return view('dashboard');
    }

    public function test(Request $request)
    {
        $validateData = $request->validate(['name' => 'required']);

        echo 'submitted';
    }
}

Цель состоит в том, чтобы отправить форму, но сейчас я просто хочу, чтобы ошибки возвращались через запрос AJAX. Я использую Laravel 5.6.

Когда я получаю сообщение об ошибке, журнал Console.log распечатывается, а тест состояния - это то, что отображается как необработанная сущность.

Обновлено: вот данные из моего журнала консоли:

{readyState: 4, getResponseHeader: ƒ, getAllResponseHeaders: ƒ, setRequestHeader: ƒ, overrideMimeType: ƒ, …}
abort
:
ƒ ( statusText )
always
:
ƒ ()
catch
:
ƒ ( fn )
done
:
ƒ ()
fail
:
ƒ ()
getAllResponseHeaders
:
ƒ ()
getResponseHeader
:
ƒ ( key )
overrideMimeType
:
ƒ ( type )
pipe
:
ƒ ( /* fnDone, fnFail, fnProgress */ )
progress
:
ƒ ()
promise
:
ƒ ( obj )
readyState
:
4
responseJSON
:
errors
:
{name: Array(1)}
message
:
"The given data was invalid."
__proto__
:
constructor
:
ƒ Object()
hasOwnProperty
:
ƒ hasOwnProperty()
isPrototypeOf
:
ƒ isPrototypeOf()
propertyIsEnumerable
:
ƒ propertyIsEnumerable()
toLocaleString
:
ƒ toLocaleString()
toString
:
ƒ toString()
valueOf
:
ƒ valueOf()
__defineGetter__
:
ƒ __defineGetter__()
__defineSetter__
:
ƒ __defineSetter__()
__lookupGetter__
:
ƒ __lookupGetter__()
__lookupSetter__
:
ƒ __lookupSetter__()
get __proto__
:
ƒ __proto__()
set __proto__
:
ƒ __proto__()
responseText
:
"{"message":"The given data was invalid.","errors":{"name":["The name field is required."]}}"
setRequestHeader
:
ƒ ( name, value )
state
:
ƒ ()
status
:
422
statusCode
:
ƒ ( map )
statusText
:
"Unprocessable Entity"
then
:
ƒ ( onFulfilled, onRejected, onProgress )
__proto__
:
Object