CODEWITHSUNDEEP
ruby-on-railstwitter-bootstrapwill-paginate
ummm....
ummm....

Reputation: 81

Twitter Bootstrap work with will_paginate

I made will_paginate work fine, but I'm facing errors hooking up Twitter Bootstrap. My single-line will_paginate links become a bulleted list of links.

<% will_paginate @thing %>

becomes:

<%= will_paginate @thing, :renderer => BootstrapPagination::Rails %>

or I guess more modern:

<%= will_paginate @thing, renderer: BootstrapPagination::Rails %>

I get the vertical bulleted listing either way and I've tried including = and - signs, but I'm lost.

Upvotes: 4

Views: 9139

Answers (3)

daino3
daino3

Reputation: 4566

Updated gist for bootstrap 4: https://gist.github.com/daino3/661d9742e2b9803e329a880f8c3ee529

Also, instructions for using plain-old will_paginate and bootstrap 4 with the custom renderer:

instructions

For bootstrap 4,throw this gist code into config/initializers/will_paginate.rb

Then, the code below into application_helper.rb:

  def will_paginate(collection_or_options = nil, options = {})
    if collection_or_options.is_a? Hash
      options, collection_or_options = collection_or_options, nil
    end
    unless options[:renderer]
      options = options.merge renderer: WillPaginate::ActionView::BootstrapLinkRenderer
    end
    super *[collection_or_options, options].compact
  end

And finally, call in the view like so:

nav aria-label="blah"
  = will_paginate @items

Upvotes: 3

Kineolyan
Kineolyan

Reputation: 743

To use will_paginate along with bootstrap, it is advised add the gem "bootstrap-will_paginate" to your project (see http://www.railstutorial.org/book/updating_and_deleting_users#sec-pagination).

Additionally, if you are using Twitter Bootstrap 3.x, there is an excessive div wrapping the pagination list to remove. Thanks this thread for the patch: https://gist.github.com/henrik/1214011

To sum up the patch, put the following in /config/initializers as will_paginate.rb.

# File config/initializers/will_paginate.rb
# From https://gist.github.com/1214011

module WillPaginate
    module ActionView
        def will_paginate(collection = nil, options = {})
            options[:renderer] ||= BootstrapLinkRenderer
            super.try :html_safe
        end

    class BootstrapLinkRenderer < LinkRenderer
        protected

        def html_container(html)
            tag :ul, html, container_attributes
        end

        def page_number(page)
            tag :li, link(page, page, :rel => rel_value(page)), :class => ('active' if page == current_page)
        end

        def previous_or_next_page(page, text, classname)
            tag :li, link(text, page || '#'), :class => [classname[0..3], classname, ('disabled' unless page)].join(' ')
        end

        def gap
            tag :li, link(super, '#'), :class => 'disabled'
        end

        end
    end
end

Upvotes: 5

ummm....
ummm....

Reputation: 81

I got this working, with little help from docs, naturally.

Instead of just this:

<%= will_paginate @thing, renderer: BootstrapPagination::Rails %>

I needed this:

<div class="pagination">
  <%= will_paginate @thing, renderer: BootstrapPagination::Rails %>
</div>

Upvotes: 3

Related Questions