Laravel: Validate a name input in a form

Question

I'm using laravel and have a form.How do I validate a name for a input field within a form. so that random numbers cannot be entered in the the field. It is just a simple input field:

<div class="col-md-6 col-sm-6">
   <label>First Name: </label>
</div>

<div class="col-md-6 col-sm-6">
   <input type="text" class ="span3" name="first_name" id="first_name" 
      required/><br><br>
</div>

I have validated an email through an example I saw and it is validates as soon you leave that input box after typing instead of waiting to click the submit button.

How would I be able to do that? Meaning, as soon as the user leaves the input field after typing in something(a number), it validates and says something(like 'please enter a proper name'). I'm not sure if its requires using the regex or not, and how would I be able to get my desired result.

My code for the email is as:

<div class="row">
   <div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
        <div class="col-md-6 col-sm-6">
            <label>Email: </label>
        </div>
        <div class="col-md-6 col-sm-6">
        <input type="email" class ="span3" id="email" name="email" value="{{ 
              old('email') }}" required/><br><br>
         @if ($errors->has('email'))
           <span class="help-block">
             <strong>{{ $errors->first('email') }}</strong>
           </span>
        @endif
   </div>
</div> 

I was able to do this from an example and this validates the email as soon as a user types.

Answer 1

To validate a request in Laravel, you can do two different things:

---

Option 1. The validator

Let's say your form is being posted to the method test in a controller:

public function test(Request $request)
{
    //
}

What you could do in this method, is utilize the validator like this:

public function test(Request $request)
{
    $this->validate($request, [
        'email' => 'required|email',
    ]);
}

A complete list of validation rules can be found Here. Using this will throw a bunch of errors back, when the validation rules fail. Instructions on how to show these errors in a view can be found Here.

---

Option 2. Form request validation

Another option would be to use request classes. These request classes can be generated with a artisan command. The signature for this command is as follows:

php artisan make:request {NAME OF YOUR REQUEST}

For the sake of this answer, I'll use a request class named TestRequest. After generation, the class will look like this:

<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

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

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array
     */
    public function rules()
    {
        return [
            //
        ];
    }
}

Let's quickly break it down.

The authorize function: This function does what it's name sounds like. It determines if a user is authorized to make this request. A small example is this, on a website with a guest book, everyone is allowed to post a comment, so you'd do return true:

public function authorize()
{
    return true;
}

But, if you want a user to only be allowed if he has certain permissions, you can also check that from this function. However, the authorize function MUST return a boolean (true/false). To see how this is done, read up on Laravel's gates here.

The rules function: In this function, validation rules for the fields can be set. These rules are the same as mentioned before when talking about the validator. A small example is this:

 public function rules()
    {
        return [
            'email' => 'required|email'
        ];
    }

Where the key of the array element is the name attribute of the form, and the value is a list of the validation rules, divided by a |.

I suggest you read up on Laravel's validation in general, which can be done here.

I hope this was in any means helpful. Cheers!

Answer 2

In jQuery, You can use focusout method as soon as the input field #first_name was out of focus. https://api.jquery.com/focusout/

If you want to check if the given value provided is valid or not, You can use [regular expression] just like what you did on your email input field:

Here's a given example:

$('#first_name').focusout(function() {
    var sValue = $(this).val();
    var sEmailPattern = /[a-z][A-Z]$/i;
    var bCheckValue = sEmailPattern.test(sValue);
    console.log(bCheckValue);

    if (bCheckValue !== true) {
        alert('please enter a proper name');
        return false;
    }

    // Rest of code ....

});

Hope this helps for your case.