protonemedia / laravel-splade

💫 The magic of Inertia.js with the simplicity of Blade 💫 - Splade provides a super easy way to build Single Page Applications (SPA) using standard Laravel Blade templates, and sparkle it to make it interactive. All without ever leaving Blade.
https://splade.dev
MIT License
1.47k stars 111 forks source link

x-splade-rehydrate doesn't reload content if SpladeForm submit #525

Open p4rad0xus opened 1 year ago

p4rad0xus commented 1 year ago

Description:

On a Blade page I use a table and a form. To create the table I use SpladeForm in the controller.

When the form is sent, the contents of the table should be reloaded using x-splade-rehydrate. Instead the page is reloaded and the new entry is displayed. If I remove the stay attribute on the x-splade-form tag and add ->stay() to the SpladeForm instead, you stay on the page but the table is not reloaded.

I have the same behavior when I use the SpladeForm class.

Steps To Reproduce Issue:

In the frontend my site looks like this:

<div>
    <div>
        <x-splade-form :for="$form" stay @success="$splade.emit('entry-added')" />
    </div>
    <div>
        <x-splade-rehydrate on="entry-added">
            <x-splade-table :for="$table" :reset-button="false">
                <x-slot:empty-state>
                    <p>
                        No entries.
                    </p>
                </x-slot:empty-state>
            </x-splade-table>
        </x-splade-rehydrate>
    </div>
</div>

My index function in the controller:

TableEntrys is a SpladeTable.

public function index()
{
    return view('/tabel_entries.index', [
        'table' => TableEntrys::class,
        'form' => SpladeForm::make()
            ->action(route('table_entry.store'))
            ->fields([
                Input::make('title'),
                Submit::make()
                    ->label('Add')
            ])
    ]);
}

My store function in the controller:

public function store(TableEntryFormRequest $request)
{
    TableEntry::create($request->validated());
     return redirect($request->getRequestUri());
}
p4rad0xus commented 8 months ago

If I just use the x-splade-form component in the Blade file, the rehydration works as expected.

<x-splade-form action="{{ route('table_entry.store') }}"
                            @success="$splade.emit('entry-added')"
                            class="flex flex-row items-end space-x-4"
                            stay>
</x-splade-form>

Is it in this solution possible to reset the formula if the submit was a success?

Do anyone know a solution for the rehydration by using the SpladeForm?