PetroGromovo's avatar

Why notification is not called when data are saved and redirected to other page?

On laravel/vue/inertiajs/element-plus site I make notification when data are saved and redirected to other page

public function update(TaskRequest $request, int $taskId)
    {
        \Log::info( '-1 update $request->all()::' . print_r( $request->all(), true  ) );

        $task = Task::findOrFail($taskId    );
        try {
            ...
            $task->updated_at = Carbon::now(config('app.timezone'));
            $task->save();

            DB::commit();
        } catch (Exception $e) {
            DB::rollBack();
            return back()->withErrors(['error' => $e->getMessage()]);
        }
        \Log::info( 'BEFORE NOTIFY' );

        Session::flash('success','The task was successfully updated 12!');
        return redirect()
            ->route('admin.tasks.index')
            ->with('success', 'The task was successfully updated 34!');
    } // public function update(TaskRequest $request, int $taskId)

In app/Providers/AppServiceProvider.php :

public function boot(): void
{
    Vite::prefetch(concurrency: 3);

    \Log::info( '-1 session(\'success\')::' . print_r( session('success'), true  ) ); // In these 2 values in are empty values
    \Log::info( '-12 session(\'error\')::' . print_r( session('error'), true  ) );
    Inertia::share([
        'flash' => function () {
            return [
                'success' => session('success'),
                'error' => session('error'),
            ];
        },
    ]);

Under telescope I see message sent by redirect method :

enter image description here

So watches in layout are not called :

import { ref, watch } from 'vue'
import { usePage } from '@inertiajs/vue3'
import { ElNotification } from 'element-plus'

import { Document, Setting, Location, Menu } from '@element-plus/icons-vue'
const page = usePage()

console.log('page.props.flash::', page.props.flash)

watch(() => page.props.flash.success, (msg) => {
    console.log('vwatch msg::', msg)
    if (msg) {
        ElNotification({ type: 'success', title: 'Success', message: msg })
    }
})
watch(() => page.props.flash.error, (msg) => {
    console.log('vwatch msg::', msg)
    if (msg) {
        ElNotification({ type: 'error', title: 'error', message: msg })
    }
})

What is wrong ?

"php": "^8.2",
"laravel/framework": "^11.31",
"spatie/laravel-data": "^4.18",


"@inertiajs/inertia": "^0.11.1",
"@inertiajs/vue3": "^2.2.15",
0 likes
4 replies
vincent15000's avatar

The notification seems to be on the previous page, so if there is a redirection, the new page doesn't receive the notification.

PetroGromovo's avatar

I made :

    return redirect(route('admin.tasks.index'))
        ->with('success', 'You have deleted task successfully 98')

I expected that index would be opened WITH success message. Isn't so ? If no in which way can I make it ?

1 like

Please or to participate in this conversation.