laravel 8 jetstream with Inertia.js Stack not updating the profile information

Question

I am using laravel 8 with jetstream with Inertia.js Stack. My database field names are in snake_case and I used camelCase inside the template. I added new fields as Test, About, Display Name and Points to the profile. I can successfully save the date for all inputs but when I refresh I can see that the Display Name is not bringing the data. Not sure why this is and if I change the display_name to snkae_case in both the template and database then it brings back all saved information to display profile. Can anybody please guide me on this one.

UpdatesUserProfileInformation.php

<?php

namespace App\Actions\Fortify;

use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Support\Facades\Validator;
use Illuminate\Validation\Rule;
use Laravel\Fortify\Contracts\UpdatesUserProfileInformation;

class UpdateUserProfileInformation implements UpdatesUserProfileInformation
{
    /**
     * Validate and update the given user's profile information.
     *
     * @param  mixed  $user
     * @param  array  $input
     * @return void
     */
    public function update($user, array $input)
    {
        Validator::make($input, [
            'name' => ['required', 'string', 'max:255'],
            'email' => ['required', 'email', 'max:255', Rule::unique('users')->ignore($user->id)],
            'photo' => ['nullable', 'image', 'max:1024'],
        ])->validateWithBag('updateProfileInformation');

        if (isset($input['photo'])) {
            $user->updateProfilePhoto($input['photo']);
        }

        if ($input['email'] !== $user->email &&
            $user instanceof MustVerifyEmail) {
            $this->updateVerifiedUser($user, $input);
        } else {

            $user->forceFill([
                'name' => $input['name'],
                'email' => $input['email'],
                'about'=> $input['about'],
                'display_name'=> $input['displayName'],
                'points'=> $input['points'],
                'test'=> $input['test'],
            ])->save();

        }
    }

    /**
     * Update the given verified user's profile information.
     *
     * @param  mixed  $user
     * @param  array  $input
     * @return void
     */
    protected function updateVerifiedUser($user, array $input)
    {
        $user->forceFill([
            'name' => $input['name'],
            'email' => $input['email'],
            'email_verified_at' => null,
        ])->save();

        $user->sendEmailVerificationNotification();
    }
}

This is UpdateProfileInformationForm.vue

 <div class="col-span-6 sm:col-span-4">
            <jet-label for="name" value="Name" />
            <jet-input id="name" type="text" class="mt-1 block w-full" v-model="form.name" autocomplete="name" />
            <jet-input-error :message="form.error('name')" class="mt-2" />
        </div>

        <!-- Email -->
        <div class="col-span-6 sm:col-span-4">
            <jet-label for="email" value="Email" />
            <jet-input id="email" type="email" class="mt-1 block w-full" v-model="form.email" />
            <jet-input-error :message="form.error('email')" class="mt-2" />
        </div>

        <!-- About -->
        <div class="col-span-6 sm:col-span-4">
            <jet-label for="about" value="About" />
            <jet-input id="about" type="text" class="mt-1 block w-full" v-model="form.about" autocomplete="about" />
            <jet-input-error :message="form.error('about')" class="mt-2" />
        </div>

        <!-- Display Name -->
        <div class="col-span-6 sm:col-span-4">
            <jet-label for="displayName" value="Display Name" />
            <jet-input id="displayName" type="text" class="mt-1 block w-full" v-model="form.displayName" autocomplete="displayName" />
            <jet-input-error :message="form.error('display_name')" class="mt-2" />
        </div>

        <!-- Total Points -->
        <div class="col-span-6 sm:col-span-4">
            <jet-label for="points" value="Points" />
            <jet-input id="points" type="text" class="mt-1 block w-full" v-model="form.points" autocomplete="points" />
            <jet-input-error :message="form.error('totalPoints')" class="mt-2" />
        </div>


        <!-- Test -->
        <div class="col-span-6 sm:col-span-4">
            <jet-label for="test" value="test" />
            <jet-input id="test" type="text" class="mt-1 block w-full" v-model="form.test" autocomplete="test" />
            <jet-input-error :message="form.error('test')" class="mt-2" />
        </div>

    </template>

score 0 · Answer 1 · answered Sep 16 '21 at 08:26

Please write a UpdateProfileInformationForm.vue script http/fetch/axios/form or Inertia use post or get dataForm or userForm Inertia. now. ->validateWithBag('updateProfileInformation'); your use it widt it:

submit() {
  this.$inertia.post('/users', this.form)
},

but it open the dialog reponse or capture errorsBag / errors props

https://inertiajs.com/validation[if use inertia]1

Axios ->validateWithBag('updateProfileInformation'); is response error validate errorsBag / errors

are can use conditional in controller

$response->input('name')
return error||pass

laravel 8 jetstream with Inertia.js Stack not updating the profile information

1 Answers1