submit prevent doesn't work laravel livewire

Question

i am doing tutorials doing comments website, i have app layout which yield content and register page the view is working fine but the form in register submit prevent doesnt work it just refresh when submitted.

here are the codes layout app blade php

 
`--``

<!DOCTYPE html>
<html lang="en">
<head>

    ...

    
    @livewireStyles
    @livewireScripts

    <script src="{{asset('js/app.js')}}"></script>

</head>

<body class="flex flex-wrap justify-center bg-blue-100">

    <div class="flex w-full justify-between px-4 bg-purple-900 text-white">
        <a class="mx-3 py-4" href="/">Home</a>
        <div class="py-4">
            <a class="mx-3" href="/login">Login</a>
            <a class="mx-3" href="/register">Register</a>
        </div>
    </div>
    <div class="my-10 w-full flex justify-center">
        @yield('content')
    </div>

    
    
    <script src="https://cdn.jsdelivr.net/gh/livewire/turbolinks@v0.1.x/dist/livewire-turbolinks.js" data-turbolinks-eval="false"></script>
    <script type="module">
        import hotwiredTurbo from 'https://cdn.skypack.dev/@hotwired/turbo';
    </script>
</body>

</html>

register blade php

@section('content')

<div class="my-10 flex justify-center w-full">
    <section class="border rounded shadow-lg p-4 w-6/12 bg-gray-200">
        <h1 class="text-center text-3xl my-5">SignUp to Get Started</h1>
        <hr>
        <form class="my-4" wire:submit.prevent="submit">
            <div class="flex justify-around my-8">
                <div class="flex flex-wrap w-10/12">
                    <input type="name" class="p-2 rounded border shadow-sm w-full" wire:model="form.name"
                        placeholder="Name" />
                    @error('form.name') <span class="text-red-500 text-xs">{{ $message }}</span> @enderror
                </div>
            </div>

            <div class="flex justify-around my-8">
                <div class="flex flex-wrap w-10/12">
                    <input type="email" class="p-2 rounded border shadow-sm w-full" placeholder="Email"
                        wire:model="form.email" />
                    @error('form.email') <span class="text-red-500 text-xs">{{ $message }}</span> @enderror
                </div>
            </div>

            <div class="flex justify-around my-8">
                <div class="flex flex-wrap w-10/12">
                    <input type="password" class="p-2 rounded border shadow-sm w-full" placeholder="Password"
                        wire:model="form.password" />
                    @error('form.password') <span class="text-red-500 text-xs">{{ $message }}</span> @enderror
                </div>
            </div>

            <div class="flex justify-around my-8">
                <div class="flex flex-wrap w-10/12">
                    <input type="text" class="p-2 rounded border shadow-sm w-full" 
                        placeholder="Confirm Password" wire:model="form.password_confirmation" />
                </div>
            </div>
            
            <div class="flex justify-around my-8">
                <div class="flex flex-wrap w-10/12">
                    <input type="submit" value="Register" class="p-2 bg-gray-800 text-white w-full rounded tracking-wider cursor-pointer" />
                </div>
            </div>
        </form>
    </section>
</div>

@endsection

this is my first time posting, i searched in a lot of places but didnt find the solution.

it worked when i used @livewire('register') in app layout but if i use that the register page is visible in all other pages when app layout is called

Answer 1

I found the solution, The problem was i am using the livewire 1.0 code which is '@yield('content')' in app layout, i changed that to '{{ $slot }}' and removed '@section('content')' blade code from my views it worked fine Check the documentation https://laravel-livewire.com/docs/2.x/upgrading#route-livewire

submit prevent doesn't work laravel livewire

Question

1 answers

solution1
0 ACCPTED 2022-12-11 03:55:17

submit prevent doesn't work laravel livewire

Question

1 answers

solution1 0 ACCPTED 2022-12-11 03:55:17

solution1
0 ACCPTED 2022-12-11 03:55:17