Level 122
try
<a href="#" wire:click.prevent="getCatId({{ $cat->id}})">
... assuming your id is numeric
and sort this out
$this->getCatId = Category::findOrFail($id);
you can't have a public property and a method with identical names
Sep 25, 2021
15
Level 5
Passing category id to livewire class not working
Hi all,
I've Category class that has manyToone relation with posts, i'm showing category's name with the number of its posts, then when a user click on it, i'm taking the category id to CategorySideList livewire and getting all its posts and then showing them to user in category-side-list livewire component, what i got from the doc, that i can pass id to livewire class CategorySideList as wire:click="getCatId{{category_id}}" but its not working,
sending category id
<div class="common-right-content widget-item">
<h3>Categories</h3>
<ul>
@if($sidebar_categories && $sidebar_categories-> count() > 0)
@foreach ($sidebar_categories as $cat )
<li>
<a href="wire:click='getCatId({{ $cat->id}})'">{{ $cat->title }} ({{ $cat->posts->count() }})</a>
</li>
<li>
@endforeach
@endif
</ul>
</div>
then getting the categor id in CategorySideList livewire
class CategorySideList extends Component
{
public $getCatId;
use WithPagination;
protected $paginationTheme = 'bootstrap';
public function getCatId($catId){
dd($catId);
$this->getCatId = Category::findOrFail($id);
}
public function render()
{
$categories_posts = $getCatId->posts()->orderBy('id','desc')->paginate(6);
return view('livewire.category-side-list',compact('categories_posts'));
}
}
i checked in getCatId() method dd($catId); but its not called, it means i'm not even sending the id here, i appreciate your help !
Level 5
@Snapey i appreciate your help! i guess because of this href="#" , its taking me to the same page, and not hitting getCatId() in livewire, i'm getting the category id+# like /5# in url
i changed the public variable to public $catId;
Level 122
make sure you have livewire scripts loaded on the page
1 like
Level 5
@Snapey yes @livewireStyles and @livewireScripts are being loaded in page !
Level 122
provided the wire: click is within the view rendered by your component and not outside of it, and livewire scripts is loaded then the . prevent stops the href being followed
1 like
Level 5
@Snapey i guess there is something wrong with my livewire scripts, although i inspected it and found the js and style scripts are being loaded, this is weird,
Does this have anything to do with 'asset_url' => null, in
myapp\vendor\livewire\livewire\config\livewire.php ?
And also, i'm taking the category id from component which was created by php artisan make:component its in view/components/detail-sidebar.blade.php , i don't know this makes difference
Level 122
@Zoul from what you have hinted at on the description, the button you click is not in the same component
Level 5
@Snapey yes i did, the category id is in another component, then taking it to livewire and send its data to another livewire component, just to be more clearer if there is difference between component created by php artisan make:component and and livewire component created by php artisan make:livewire,
Level 122
if you want to communicate between livewire components you must use events not wire:click
whether you use laravel components is irrelevant
Level 5
@Snapey fortunately i re-explained it, i will look for a solution and let you know if i have any issue
Level 5
I got the category id in moun method, but its not being rendered in render() method in component
<a href="{{ route('cat.id', ['id' => $cat->id]) }}">{{ $cat->title }} ({{ $cat->posts->count() }})</a>
in routes
Route::group(['prefix' => 'cat'], function () {
Route::get('id/{id}', [App\Http\Livewire\CategorySideList::class,'mount'])->name('cat.id');
});
in CategorySideList livewire
class CategorySideList extends Component
{
public $catId;
use WithPagination;
protected $paginationTheme = 'bootstrap';
public function mount($id)
{
//dd($id); this returns "1"
$this->catId = Category::findOrFail($id);
//dd($this->catId->posts); this returns all related posts
}
public function render()
{
$categories_posts = $this->catId->posts()->orderBy('id','desc')->paginate(6);
//dd($categories_posts);
return view('livewire.category-side-list',compact('categories_posts'));
}
}
Level 51
Your code doesn't make sense.
There are lots of lessons here on laracasts for Livewire.
https://laracasts.com/topics/laravel-livewire
And, in the docs... Notice here there is no mention of using a route...
https://laravel-livewire.com/docs/2.x/quickstart
The only time you'd use a route is if your whole page was the livewire component. For example...
Route::get('/posts', App\Http\Livewire\Posts::class)->name('posts');
Here is the docs section on rendering components...
1 like
Level 5
@webrobert thanks for your support ! It would be greate to cover some livewire lessons, but i can't effort it right now unfort, i will think about it later.
I went through the docs and i'm trying to make it work but its not working, as i'm still very new to livewire,
i'm passing data between components,
Level 51
Check out this page... loads of resources both paid and free. https://github.com/imliam/awesome-livewire
1 like
Level 5
@webrobert thanks a lot, this would definitely be very helpful !
Please or to participate in this conversation.