Have you tried this ?
public function updatedSearch() {
$this->render();
}
Tell me if it helps ;).
Hello friends search not working untill i refresh page manually using F5 from keyboard i think livewire compoent stoped render (reload ) in first open of the page . i have to click f5 to refresh the componet manully to make search working after refresh search is working my code
// index.php
<?php
namespace App\Http\Livewire\Admin\Program;
use App\Models\Program;
use Livewire\Component;
use Illuminate\Support\Str;
use Livewire\WithPagination;
class Index extends Component
{
use WithPagination;
protected $paginationTheme = 'bootstrap';
protected $listeners = [
'delete'
];
public $search;
public function delete($id)
{
// permation('program.delete');
$program = Program::findOrFail($id);
if ($program->governorates()->count()) {
// REDIRECT TO
return back()->with('info', __('app.delete_governorates_first'));
}
$program->delete();
session()->flash('success', __('app.data_deleted'));
}
public function render()
{
$programs = Program::where('name','LIKE','%'.Str::of($this->search)->trim().'%')->latest()->paginate(10);
return view('livewire.admin.program.index',[
'programs' => $programs,
]);
}
}
//index.blade.php
<x-slot name="title">@lang('app.dashboard') | @lang('app.programs') </x-slot>
<x-slot name="title2">@lang('app.programs')</x-slot>
<x-slot name="breadcrumbs">
<li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}" class="fw-bold">@lang('app.home')</a></li>
<li class="breadcrumb-item active">@lang('app.programs')</li>
</x-slot>
<section class="widget">
<header class="mb-4">
<h5 class="mb-3">
{{-- Table <span class="fw-semi-bold">Styles</span> --}}
</h5>
<div class="widget-controls d-flex justify-content-between w-100">
<div>
<a href="{{ route('admin.program.create') }}" title="@lang('app.create')" @lang('app.create')
class="btn btn-primary btn-lg text-white">
<i class="fa fa-pencil-square" aria-hidden="true"></i>
</a>
</div>
<div> <input type="text" class="form-control" placeholder="@lang('app.search')" wire:model="search"></div>
</div>
</header>
<div class="widget-body">
<x-admin.alerts/>
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th class="d-none d-md-table-cell">#</th>
<th>@lang('app.name')</th>
<th>@lang('app.video')</th>
<th>@lang('app.views_count')</th>
<th>@lang('app.actions')</th>
</tr>
</thead>
<tbody>
@forelse ($programs as $program)
<tr wire:key="{{ $loop->index }}">
<td class="d-none d-md-table-cell">{{ $program->id }}</td>
<td>{{ $program->translate('name') }}</td>
<td><a target="_blank" href="https://www.youtube.com/watch?v={{ $program->translate('video') }}">{{ $program->translate('video') }}</a></td>
<td>{{ $program->views }}</td>
<td class="width-150">
<a href="{{ route('admin.program.show', [$program->id]) }}" title="@lang('app.show')"
class="btn btn-warning"><i class="fa fa-eye" aria-hidden="true"></i></a>
<a href="{{ route('admin.program.edit', [$program->id]) }}" title="@lang('app.edit')"
class="btn btn-primary"><i class="fa fa-pencil-square-o" aria-hidden="true"></i></a>
<button class="btn btn-danger" title="@lang('app.delete')"
onclick="deleteConfirmation({{ $program->id }})"><i class="fa fa-times"
aria-hidden="true"></i></button>
</td>
</tr>
@empty
@lang('app.data_not_found')
@endforelse
</tbody>
</table>
<hr>
<div class="clearfix d-flex justify-content-center">
{{ $programs->links() }}
</div>
</div>
</section>
@push('js')
<script type="text/javascript">
function deleteConfirmation(id) {
Swal.fire({
title: "{!! __('app.confirm_title') !!}",
text: "{!! __('app.confirm_message') !!}",
icon: 'warning',
showCancelButton: true,
cancelButtonText: "{!! __('app.cancle') !!}",
confirmButtonColor: '#002b49',
cancelButtonColor: '#d33',
confirmButtonText: "{!! __('app.delete') !!}"
}).then((result) => {
if (result.isConfirmed) {
Livewire.emit('delete', id);
}
})
}
</script>
@endpush
Please or to participate in this conversation.