JQuery + thumbs_up gem сделать подсчет голосов? - PullRequest
Новая
       3

JQuery + thumbs_up gem сделать подсчет голосов?

2 голосов
/ 30 мая 2011

Плагины: Недурно & JQuery 1.5.2 (необходим для другого старого драгоценного камня)

Я пытаюсь отобразить обновленный счетчик голосов без полного HTTP-запроса, когда пользователь голосует за сообщение. В настоящее время он обновляет страницу при каждом голосовании.

Контроллер сообщений 

def vote_up
  post = Post.find(params[:id])
  current_user.vote_exclusively_for(post)
  respond_to do |format|
    format.js
    format.html {rRedirect_to :back}
  end
end

def vote_down
  post = Post.find(params[:id])
  current_user.vote_exclusively_against(post)
  respond_to do |format|
    format.js
    format.html {redirect_to :back}
  end
end

Просмотр голосования (каждый пост div имеет голосование слева (стиль digg / reddit) и контент справа) 

 <div class="post">
 <div class="vote">
 <div class="votewrapper">
  <span class="votecount">
  <%= post.votes_for - post.votes_against %>
    </span>
  <div class="votebtn">
   <%= link_to image_tag('vote.png'), vote_up_post_path(post), :method => :post, :format => :js %>
     </div>
   </div>
   </div>
   <div class="postcontent">
   all the post content, timestamp stuff, etc...
   </div>
   </div>

voice_up.erb.js (в папке «Сообщения»). 

$(".votecount").html(
"<%= escape_javascript post.votes_for - post.votes_against %>");

Я застрял на этом некоторое время и был бы очень признателен за любую помощь, которую вы можете предложить. Я видел Jskery Railscast и просматривал другие ответы Stackoverflow, но я все еще довольно нелюбезен в Jquery.

1 Ответ

6 голосов
/ 20 июня 2011

Похоже, вы захотите разделить ваш код представления на частичные и обновлять только один частичный, когда предоставляется оценка.

Для вашего контроллера, вместо: 

respond_to do |format|
    format.js
    format.html {redirect_to :back}
  end

Сделайте что-то вроде: 

render :partial => "voutecount"

По вашему мнению, переместите div элементwwewwrapper в новый файл с именем "_votecount.html.erb "в том же каталоге, и вместо этого используйте код рендеринга: 

 <%= render :partial => "votecount" %>

Если вы хотите заблокировать рейтинг во время его обновления (рекомендуется), то вы можете отрегулировать вызов иконтролировать это больше в JS.Итак, включите ваш javascript в представление: 

<%= javascript_include_tag 'votecount' %>

замените ваш link_to на хороший старый html, чтобы иметь больше информации: 

<a href="" class="ratelink" updown="up" theid="123"><img src = "...."></a>
<a href="" class="ratelink" updown="down" theid="123"><img src = "...."></a>

И создайте новый voicecount.js в вашей общедоступнойПапка / javascripts со следующим содержимым: 

  $(function(){
        $(".ratelink").click(function(){
            var val = $(this).attr('updown');
            var theid = $(this).attr('theid');
            $("#votewrapper").block({ //blocks rate-rates while processing
                message: null,
                overlayCSS: {
                    backgroundColor: '#FFF',
                    opacity: 0.6,
                    cursor: 'default'
                },
            });
        if (val == "up") {
        $.ajax({
                type: 'PUT',
                url: "/mymodel/voteup?id="+theid,
                success: function(){
                            $("#votewrapper").unblock();
                            }   
                   });
        } else {
             $.ajax({
                type: 'PUT',
                url: "/mymodel/votedown?id="+theid,
                success: function(){
                            $("#votewrapper").unblock();
                            }   
                   });
        }
    })

удачи!:)

...