Pagination on live server not working properly

Hello everyone!

I’v been experimenting with Livewire for quite a while now and on local server everything is working perfectly fine. But on live server pagination seems to be broken. I’ll put some screenshots below.

So what’s seems to be issue, when I move to second page almost 90% of the content from first page is duplicated and rendered on second page, also most of the items are missing.

All the records are from database and they are in place.

Livewire Version is 2.4

The data I’m showing are just comments (Lorem) with fake names from Faker

Results of page 1

Results of page 2

Notice how almost everything is the same on these two.

Livewire Component

use WithPagination;

public $search = '';
public $orderBy = 'desc';  // default

public function updatingSearch()
{
    $this->resetPage();
}

public function deleteComment($commentID)
{
    Comment::destroy($commentID);
}

public function render()
{
    return view('livewire.admin.comment.show-comments', [
        'comments' => Comment::where('comment', 'like', '%'.$this->search.'%')
                            ->orWhere('name', 'like', '%'.$this->search.'%')
                            ->orderBy('created_at', $this->orderBy)
                            ->paginate(16)
    ]);
}

The View is just a foreach loop

On local server I’m not facing this issue and everything is looking just fine.

For my production server I’m using DigitalOcean via Laravel Forge.

I did clean cache multiple times but still nothing.

1 Like

It’s a DOM diffing issue, add wire:key="{{ $comment->id }}" to the div directly below your foreach loop.

On a side note wire:click='deleteComment({{ $comment->id }}) is not ideal. Check out the post below and the links inside that post.

Thank you so much for replying. I’ll definitely check this out.

@wayz9 I think you have genius mind. And the way you taught us this criteria i think it fabulous. :slightly_smiling_face:

1 Like

The issue is now solved.

The data I was using was seeded and each entry had the same timestamp. So for some reason that’s why I was seeing same data across pages. Yeah weird… After manually inserting 100 comments to the database the problem was gone, every page had different data and it was working perfectly.

And yeah for the local development I was using sqlite, and on the liveserver I’m using MySQL 8 on Laravel Forge.

Closing the thread.