Adding AJAX to will_paginate content showing up on link page that's not supposed to be there

Question

I added ajax_pagination using this wiki https://github.com/ronalchn/ajax_pagination/wiki/Installing

it works but when i click on a link in the news section the slider on top shows up on the show page when its not suppose to be there but when you refresh the page it goes away and is back to normal

does anyone know how to fix this?

heres my view

batnews.html.erb

<div class="container">
  <br /><br />
  <h2 class="black">
    Featured Articles
   <div class="line_section"><div>
  </h2>
  <ul class="example2">
  <% @articles.each do |article| %>
    <li>
      <h2><%= link_to(article.title, article, style: 'color: #4C4C4C;') %></h2>

      <%= link_to image_tag(article.photo, style: 'width: 400px; float: left; margin-right: 20px; margin-top: -10px; height: 260px;'), article %>

          <div class="info" style="position: relative; right: -20px; top: -3px;">
            <img style="position: relative; top: -2px;" src="/assets/icon_calendar.png">
            <%= article.date %>
            <img style="position: relative; top: -2px;" src="/assets/icon_author.png">
             <%= article.author %>
            <img style="position: relative; top: -2px;" src="/assets/icon_talk.png">
            <!-- TODO make this link scroll down to comments section smoothly -->
             <%= link_to article.comments.count, article %> <%= link_to 'comments', article %></a>
          </div>
      <p style="width: 460px; float: right;"><%= truncate article.content, length: 400 %>
        <br />
        <%= link_to('Read More', article, style: 'font-size: 12px;') %></p>
     </li>
      <% end %>
   </ul>
  </div>

   <%= ajax_section :id => "recent_news", :render => "recent_news" %>

heres my paritial that im rendering _recent_news.html.erb

  <div class="container">
   <br />
    <br />
    <h2 class="black">
      Recent News
       <div class="line_section"><div>
      </h2>
     <%= ajax_links :section_id => "recent_news" do %>
   <%= will_paginate @news_all %>
    <div class="row"> 
   <div class="span12">

    <ul class="recent-news"> 

    <% @news_all.each do |news| %>

    <li style="font-size: 16px; line-height: 19px; letter-spacing: 1px; font-size: 14px; color: #555; text-align: left;">
    <%= link_to image_tag(news.photo.url), news, class: 'pull-left', style: 'margin-right:40px; margin-top: 2px; width: 300px;' %> 
     <div style=" width: 600px; float: right;">
    <%= link_to news.title, news %> 

  <br />

   <%= link_to news.date, news, style: 'font-size: 10px; color: black; position: relative; top: 15px;' %> 

    <i style="position: relative; top: 18px;" class="icon-comment"><%= link_to   (news.comments.count), news, :style => 'font-size: 8px; color: white; font-weight: bold;    position: absolute; top: 0px; right: 5px;' %></i>
    <br /><br />
    <%= truncate news.content, length: 500 %> 
   <br />  
    <%= link_to 'Read More...', news, style: 'font-size: 12px !important;' %>
     </div>
   </li>
  <% end %> 
  <%= will_paginate @news_all %>
  <% end %>
  </div><!-- end span12 -->


 </div><!-- end row -->
   </div><!-- end container -->

heres my controller

static_pages_controller.rb

def batnews
  @articles = Article.all
  @news_all = News.all
  @news_all = News.paginate(page: params[:page], per_page: 4, :order => 'created_at DESC')
  @comment_count = Comment.count(:id)
  respond_to do |format|
  format.html # index.html.erb
  ajax_respond format, :section_id => "recent_news"
  end
end

here my gems

gem 'rails', '3.2.8'
gem 'bootstrap-sass', '2.0.4'
gem 'bcrypt-ruby', '3.0.1'
gem 'faker', '1.0.1'
gem 'will_paginate', '3.0.3'
gem 'bootstrap-will_paginate', '0.0.6'
gem 'jquery-rails', '2.0.2'
gem 'jquery-ui-rails'
gem "haml", "~> 3.1.7"
gem 'twitter-bootstrap-rails', :git => 'git://github.com/seyhunak/twitter-bootstrap-rails.git'
gem 'activerecord-reputation-system', require: 'reputation_system'
gem "paperclip", :git => "git://github.com/thoughtbot/paperclip.git"
gem 'aws-sdk'
gem 'friendly_id'
gem 'ajax_pagination'
gem "jquery-historyjs"

heres the link to the site where you can see the behavior im talking about http://www.batman-fansite.com/batnews

so if you click on the one of the news in recent_news you will be taken to the show page scroll up and you will notice the slider still being there....hit refresh and the slider will be gone...

How can i fix this problem?

Noz · Answer 1 · 2012-12-20T21:56:45.367

0

There's actually a simple explanation for this, your ajax is only replacing the HTML within your <div id="recent_news" class="ajax_section"> tag. Since your carousel is not a child of recent_news it's content doesn't get replaced with the newly requested HTML. A simple solution would be to wrap your ajax selection around whatever content that you want to be replaced.

edited Dec 20 '12 at 21:56

answered Dec 20 '12 at 21:44

Noz

6,216
3
47
82

im sorry your explanation makes sense but how would i implement that? – user1502223 Dec 20 '12 at 21:57
i dont want the slider to appear on the next page i only want the content of the article – user1502223 Dec 20 '12 at 21:58
Move your featured articles container into `
`
– Noz Dec 20 '12 at 22:06
so it should be <%= ajax_links :section_id => "recent_news" do %> <% my partial for news %> <% end %> – user1502223 Dec 20 '12 at 22:09
I'm not sure, you'll have to try it. If that doesn't work then I think you might have to write your own Javascript to make this happen if the ajax_paginiation solution your working doesn't work for your application design. – Noz Dec 20 '12 at 22:20
tried to move the ajax links around but getting the same results...sigh this is frustrating – user1502223 Dec 20 '12 at 23:01

score 0 · Answer 2 · edited May 23 '17 at 12:04

0

This doesn't directly answer your question, but it could solve your problem: I tried a lot of different ajax will_paginate solutions and none did what I wanted. I then went on to use the normal will_paginate gem and wrote a custom link renderer that creates them as ajax based. The full solution is posted here.

edited May 23 '17 at 12:04

Community

1
1

answered Dec 20 '12 at 21:46

Pierre Pretorius

2,869
22
21

Thanks for the suggestion but It took me so long to get this thing to work and i almost got it just for this weird bug.....so i want to try to find a solution for this...i might have to go with your own solution and start from scratch – user1502223 Dec 20 '12 at 22:28

Adding AJAX to will_paginate content showing up on link page that's not supposed to be there

2 Answers2