Ask A Question

Notifications

You’re not receiving notifications from this thread.

Pagination with Stimulus

Brad Ballard asked in Rails

I'm trying to migrate to Stimulus and I thought a good place to start would be to move all my UJS style partials that are using jQuery to Stimulus. It would be great to use one Stimulus controller for all the remote data partial rendering I do using link_to.

Thanks to a previous post, I've been successful with building a Stimulus controller and rendering a partial with using a data target. What I can't figure out is how to get my pagy pagination partial or nav to render with the link_to rendered partial.

show.html.erb

<div data-controller="renderer">
  <%= link_to visits_physician_path(@physician), data: { remote: true, action: 'ajax:success->renderer#render' } do %>
    Visits
  <% end %>
  <div data-renderer-target="display"></div>


  <div id="js-physician-pagination" class="pagination-button">
   // Where I need to render the pagination nav. 
   // Either using render nav or <%== pagy_bootstrap_nav(@pagy) %>
  </div>
</div>

controller

  def visits
    authorize(@physician)

    @pagy, @visits = pagy(Visit.where(physician: @physician.id)
                               .order(check_in: :desc)
                               .includes(:office, :user),
                          items: 5, , link_extra: 'data-remote="true"')

    respond_to do |format|
      format.html { render(partial: 'physicians/show/visit', collection: @visits) }
    end

    authorize(@visits)
  end

stimulus controller

import {Controller} from 'stimulus'

export default class extends Controller {
    static targets = ['display']

    render(evt) {
        this.displayTarget.innerHTML = evt.detail[0].body.innerHTML
    }
}

visits.js.erb (what was previously being used)

$("#js-physician-container").html("<%= j render(partial: 'physicians/show/visit', collection: @visits) %>");
$("#js-physician-pagination").html("<%== j(pagy_bootstrap_nav(@pagy)) %>");

Any help on this would be great.

Brad

Reply

Hi Brad, did you manage to solve this issue? I'm stuck on something similar right now!

https://discuss.hotwire.dev/t/pagy-infinite-scroll-and-get-post-requests/2853

Reply

No, never did. I ended up sticking with UJS as well.

Reply

Glad to see I'm not the only one suffering with turbo(links) and search/pagy... I've disabled it globally, enabling it on links that would benefit from it.

Reply
Join the discussion
Create an account Log in

Want to stay up-to-date with Ruby on Rails?

Join 87,563+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.