laravel-splade icon indicating copy to clipboard operation
laravel-splade copied to clipboard

X-Splade-Rehydrate loads the wrong part

Open Lioxen opened this issue 4 months ago • 0 comments

  • Laravel Version: 10.41.0
  • PHP Version: PHP 8.1.2-1ubuntu2.14
  • Splade JS Version (npm): 1.4.16
  • Splade PHP Version (composer): 1.4.16
  • Dev environment (OS, Sail/Valet/etc): Linux Mint 21.3 Virginia

Description:

I have on my site different x-splade-rehydrate with different names (on="name1", on="name2" ...) but it loads every time the content of the first x-splade-rehydrate even if I call the second one (push an event e.g. @success="$splade.emit('name2')")

Steps To Reproduce Issue:

  1. Add new routes in your routes file (web.php)
Route::view('/test', 'test');
Route::post('/test', function (Request $request) {
               session()->push('data.members',$request->get('name'));
           return redirect()->back();
       });
Route::view('/testmodal', 'testmodal');
Route::post('/testmodal', function (Request $request) {
               session()->push('data.users',$request->get('user'));
           return redirect()->back();
       });
  1. Add 2 views to call test.blade.php
<x-splade-rehydrate on="team-member-added">
    @if(session()->has('data.members'))
    <ul>
        @foreach(session()->get('data.members') as $member)
            <li>{{ $member }}</li>
        @endforeach
    </ul>
    @endif
</x-splade-rehydrate>

<x-splade-form action="/test" stay @success="$splade.emit('team-member-added')">
    <x-splade-input name="name" />
    <x-splade-submit />
</x-splade-form>

<Link modal href="/testmodal">Create new user</Link>

testmodal.blade.php

<x-splade-modal>
    <x-splade-rehydrate on="user-added">
        @if(session()->has('data.users'))
        <ul>
            @foreach(session()->get('data.users') as $user)
                <li>{{ $user }}</li>
            @endforeach
        </ul>
        @endif
    </x-splade-rehydrate>

    <h1>Create new user</h1>
 
    <x-splade-form action="/testmodal" stay @success="$splade.emit('user-added')">
    <x-splade-input name="user" />
    <x-splade-submit />
</x-splade-form>
</x-splade-modal>
  1. Call the test.blade.php (/test) and insert some names
  2. Click the 'Create new user' link to open the modal form
  3. Insert a name (should be a different name :) and submit the form
  4. Now you see the list of the names you inserted on the first form
  5. Reopen the modal window and you see the name you inserted on the second form (just to see, it was saved)

Lioxen avatar Feb 22 '24 12:02 Lioxen