#99 Hotwire: Search and Infinite Pagination (Ransack with Pagy)
Implementing search or pagination is relatively easy, but it can get tricky when you try to combine the two, especially when you factor in some frontend. In this eposide we will learn to use gem Ransack for search, and gem Pagy for infinite scroll pagination.
Episode source code: https://github.com/corsego/99-ransack-pagy-search-infinite-scroll/commit/ab6b64bb3f233d3deac9b7ed4a6532eb30d610bc
Text version: https://blog.corsego.com/hotwire-search-infinite-pagination
0:00 Final app demo with search and pagination
0:55 Boilerplate app
1:20 Ransack search
3:40 Search without page refresh
4:50 Remove submit button
5:40 Pagination with pagy
7:25 Infinite pagination
10:40 Stop endless pagination loop
11:35 Fix search
13:40 Query security
16:00 Highlight search results
17:05 Summary
0
Recommended based on what you are watching now
![#13: Polymorphic Comments, Nested Resources](https://superails.com/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsiZGF0YSI6MTgyNywicHVyIjoiYmxvYl9pZCJ9fQ==--88f9c60f2697a421a206df8b03d5e826518606f8/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOls0MDAsNjAwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--2d7cd3a4d9675c7f4c17dad7856d799792bd3595/maxresdefault.jpg)
#13: Polymorphic Comments, Nested Resources
![#15: Advanced ActsAsVotable Scopes - Bookmarks, Watchlist](https://superails.com/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsiZGF0YSI6MTg2OCwicHVyIjoiYmxvYl9pZCJ9fQ==--f17c575c6fddeb0367c38dc7db3249e78b397e14/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOls0MDAsNjAwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--2d7cd3a4d9675c7f4c17dad7856d799792bd3595/maxresdefault.jpg)
#15: Advanced ActsAsVotable Scopes - Bookmarks, Watchlist
![#88 Import CSV and parse it within a Rails app](https://superails.com/rails/active_storage/representations/redirect/eyJfcmFpbHMiOnsiZGF0YSI6MTc4NSwicHVyIjoiYmxvYl9pZCJ9fQ==--8034454a53623b7d657d648f8d0c69f53a0fb61e/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJqcGciLCJyZXNpemVfdG9fbGltaXQiOls0MDAsNjAwXX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--2d7cd3a4d9675c7f4c17dad7856d799792bd3595/maxresdefault.jpg)