Laravel pagination object in javascript

Question

I have an index page where I make the listing of some hospitals with a pagination.

I also have a searchbar where I can write an hospital name and the listing should be updated "in real time" with an AJAX request.

My problem is that I am not able to re-use the laravel pagination object by javascript to create the pagination. And I do not want to manage it by pure javascript/jQuery. At the moment, I'm creating a list of all objects returned. But without pagination (so the list can be huge)

So in my controller I have this function

public function index()
{
    $hospitals = Hospital::orderBy('name')->paginate(15);
    return view('admin.hospitals.show', compact('hospitals'));
}

In my view (/admin/hospitals/show.blade.php), I'm using this to create a pagination (I want to re-use this on ajax response)

<ul>
@foreach($tasks as $task)
    <li>{{ $task->name }}</li>
@endforeach
</ul>
{{ $tasks->links() }}

Which give my this result

When typing in the search bar, this ajax is called

$.ajax({
    type: "GET",
    url: '/admin/hospitals/search/'+ $('#hospital_search').val().trim(),
    success: function (data) 
    {
        if ( data.hospital.length == 0 ) 
        {
            $('#hospital_result').html('<div class="alert alert-warning">No hospitals found</div>');
        }
        else
        {
            //Actual code that give me the listing without pagination
            //Would be nice if I could do something like {{ data.hospital->links() }}
            var html = '<ul>';
            $.each( data.hospital , function( i , hospital ){    
                html += '<li><a href="/admin/hospitals/'+ hospital.id +'"><b>' + hospital.name + '</b></a></li>';});
            html += '</ul>';
            $('#hospital_result').html(html);
        }
    },
    error: function (data) 
    {
        alert('Error:', data);
    }
});

And my search function

public function search($term = null)
{       
    if( !$term )
    {
        $hospital = Hospital::orderBy('name')->get();
    }
    else
    {
        //Get match on name
        $hospital = Hospital::where('name' , 'LIKE' , '%'.$term.'%')
                        ->orderBy('name')
                        ->get(); //Should be replaced by ->paginate(15) when JS will be replaced
    }

    //Return as JSON
    return response()->json(['success' => true, 'hospital' => $hospital]);
}

How to use the ->links() on the data object in the ajax response? Or should I change my logic and load a specific view after ajax request?

You are also able to use the built in function to paginate any model. Ex: $hospital = Hospital::query()->where('name', 'LIKE' "%{$term}%")->paginate($perPage); — MrK
– MrK, Commented Apr 4, 2018 at 12:47
can you show us how you solved this, coz i'm kinda stuck in the same error you had, you can post your own answer... thanks! — Lafoune
– Lafoune, Commented Jul 25, 2019 at 8:53

Lloople · Accepted Answer · 2017-10-20 16:48:51Z

4

->links() method generates HTML code, so what you can do is to return it in it's own variable.

return response()->json([
    'success' => true,
    'hospital' => $hospital
    'pagination' => $hospital->links()
]);

Other way to proceed is to return the table html via JSON and fill a container's content with the response

return response()->json([
    'success' => true, 
    'html' => view('hospitals.list')->render()
]);

answered Oct 20, 2017 at 16:48

Lloople

1,8241 gold badge17 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Atnaize Over a year ago

Passing $hospital->links() to javascript did not worked for me. Creating a listing view and passing the rendered view to js was the solution, thanks!

9uifranco · Accepted Answer · 2024-02-19 17:02:13Z

0

Like @Lloople said, ->links() method generates HTML code, but to return as JSON I had to cast it to string:

return response()->json([
    'success' => true,
    'hospital' => $hospital
    'pagination' => (string) $hospital->links()
]);

answered Feb 19, 2024 at 17:02

9uifranco

5605 silver badges15 bronze badges

Collectives™ on Stack Overflow

Laravel pagination object in javascript

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related