Courses

Livewire 3 for Beginners with Laravel 12 Starter Kit

Edit Form: Pass Parameters to Component

Summary of this lesson:
- Creating edit functionality for existing company records
- Passing model data from controllers to Livewire components
- Populating form fields with existing values from database
- Implementing update functionality with similar validation rules

It's time to create the form to edit the company and pass the parameter from the URL to the Livewire component.


Company ID: From URL to Livewire

Imagine we have a URL /companies/1/edit, and our resourceful Controller looks like this.

app/Http/Controllers/CompanyController.php:

namespace App\Http\Controllers;
 
use App\Models\Company;
 
class CompanyController extends Controller
{
public function create()
{
return view('companies.create');
}
 
public function edit(Company $company)
{
return view('companies.edit', compact('company', 'countries'));
}
}

We get the $company with Laravel's Route Model Binding.

Now, the question is: in the Blade file, how do we pass the parameter to the Livewire component?

I've created a new edit.blade.php, almost copy-pasting everything from the create.blade.php. I know it's a code duplication, but we will optimize this when discussing full-page components and layouts in the upcoming lessons.

Here's the syntax.

resources/views/companies/edit.blade.php:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple Form</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="flex items-center justify-center min-h-screen bg-gray-100">
<livewire:company-edit :company="$company" />
</body>
</html>

See that line?

<livewire:company-edit :company="$company" />

So yeah, we will create a new Livewire component:

php artisan make:livewire CompanyEdit

We can pass parameters with the syntax...

The full lesson is only for Premium Members.
Want to access all 19 lessons of this course? (91 min read)

You also get:

  • 73 courses
  • Premium tutorials
  • Access to repositories
  • Private Discord