Laravel 8 Jetstream: adding new field to the registration process

9.9k views Asked by At

I started building a web application using Laravel 8. I have noticed that quite a lot of things have changed in Laravel 8 including authentication. Now, I am trying to use Jetstream for auth.

I have run the following command to integrate it into the application.

composer require laravel/jetstream
php artisan jetstream:install inertia
npm install && npm run dev

When I go to the /register route, I can see the registration form with name, email, password and password confirmation fields. What I would like to do is that I would like to add another field called, "company" and I would like to apply custom validation rules to it.

I found on the Jetstream documentation that I could customise the authentication process in the boot method of the JetstreamServiceProvider class as follow.

Fortify::authenticateUsing(function (Request $request) {
            
        });

But it does not apply to register. How can I customise the registration process adding new fields and applying custom validation rules?

3

There are 3 answers

5
Ali Ali On BEST ANSWER

Firstly, you should add the company field to the user table using the migration found in database\migrations\2014_10_12_000000_create_users_table.php.

public function up()
    {
        Schema::create('users', function (Blueprint $table) {
            $table->id();
            $table->string('name');
            $table->string('company');
            $table->string('email')->unique();
            $table->timestamp('email_verified_at')->nullable();
            $table->string('password');
            $table->rememberToken();
            $table->foreignId('current_team_id')->nullable();
            $table->text('profile_photo_path')->nullable();
            $table->timestamps();
        });
    }

Then run this command php artisan migrate:fresh to migrate your new users table.

Then add the field to the fillable array inside the User model found in \app\Models\User.php like so:

protected $fillable = [
    'name',
    'company',
    'email',
    'password',
];

And now you can find the registration view under resources\views\auth\register.blade.php then you can duplicate an input block to use it for the 'company' field.

Then you can do the validation in this class: app\Actions\Fortify\CreateNewUser.php

public function create(array $input)
    {
        Validator::make($input, [
            'name' => ['required', 'string', 'max:255'],
            'email' => ['required', 'string', 'email', 'max:255', 'unique:users'],
            'company' => ['required', 'string', 'max:255'],
            'password' => $this->passwordRules(),
        ])->validate();

        return User::create([
            'name' => $input['name'],
            'email' => $input['email'],
            'company' => $input['company'],
            'password' => Hash::make($input['password']),
        ]);
    }

Then, you are ready.

0
Jason Gilmore On

@Ali Ali's answer is correct however if for those of you using Inertia there is one additional step. You'll need to open resources/js/Pages/Auth/Register.vue and add the desired field to the form. Additionally, scroll down to the bottom of the file and add the field name to the this.$inertia.form input parameter object literal. For instance if the desired additional field name is company you'll add it like this:

data() {
  return {
    form: this.$inertia.form({
      name: '',
      company: '', // <- New line here
      email: '',
      password: '',
      password_confirmation: '',
      terms: false,
    })
  }
},
1
Arne On

Hmm, are these correct answers? If you install LiveWire then yes you could edit resources/views/auth/register.blade.php but with Inertia and Vue there is no such folder or file (at least in the current version). In fact there is only one file by default in the resources/viewsfolder: app.blade.php. If I got it right by design strict Inertia use does not use blade files. Am I correct? If so then the questions is not answered. Where should you add new fields when using Inertia. And in my case, using Spatie/permissions, how do you create logic to reference role information?