0

投票応答を非同期にしたい投票システムがあります。

私の「ショー」ビューでは...

<%= render 'score' %>

レンダリングする

<% if @user.voted?(@lesson) %>
    <%= render 'voted' %>
<% else %>
    <%= render 'unvoted' %>
<% end %>

そして、私の _voted.html.erb をレンダリングします

    #will display different images, colored or not based on selection
    <% if @user.up_voted?(@lesson) %>
        <div class = "up_arrow">
            <%= link_to image_tag("up_color.png", alt: "Uncheck vote"), 
                clear_vote_lesson_url(@lesson), :method => :post, remote: true %>
        </div>
        <div class="average_score"><%= @lesson.votes %></div>
        <div class= "down_arrow">
            <%= link_to image_tag("down_uncolor.png", alt: "Vote down"), 
                down_vote_lesson_url(@lesson), :method => :post, remote: true %>
        </div>
    <!-- user down voted then -->
    <% else %>
        <div class = "up_arrow">
            <%= link_to image_tag("up_uncolor.png", alt: "Vote up"), 
                up_vote_lesson_url(@lesson), :method => :post, remote: true %>
        </div>
        <div class="average_score"><%= @lesson.votes %></div>
        <div class= "down_arrow">
            <%= link_to image_tag("down_color.png", alt: "Uncheck vote"), 
                clear_vote_lesson_url(@lesson), :method => :post, remote: true %>
        </div>
    <% end %>

そして私の unvoted.html.erb は

<div class = "up_arrow">
<%= link_to image_tag("up_uncolor.png", alt: "Vote up"), 
    up_vote_lesson_url(@lesson), :method => :post, remote: true %>
</div>
<div class="average_score"><%= @lesson.votes %></div>
<div class= "down_arrow">
    <%= link_to image_tag("down_uncolor.png", alt: "Vote down"), 
        down_vote_lesson_url(@lesson), :method => :post, remote: true %>
</div>

そして最後に、コントローラーに..

    def up_vote
    lesson = Lesson.find(params[:id])
    current_user.up_vote!(lesson)

    respond_to do |format|
        format.html { render :action => 'show'}
        format.js {   ????????        }
    end
end

down_vote などのアクションがいくつかありますが、非常に似ています。

私のformat.jsブロックの中に何を入れるべきか本当にわからないと思います。私はredirect_to lesson_path(lesson)のようなものを入れてみましたが、「スコア」もレンダリングしましたが、投票画像は更新されません。

誰か助けてくれませんか？ありがとう！

更新 @ dhoelzgen

私はそれを...に変更しました

def up_vote
    lesson = Lesson.find(params[:id])
    current_user.up_vote!(lesson)
    render :score, :layout => false
    #redirect_to lesson_path(lesson)
end

他のアクションにも render :score, :layout => false を入れました。

そして私の見解では、私は持っています

<div id="surrounding_container">
    <%= render 'score' %>
</div>

一緒に

$('.up_arrow')
  .bind 'ajax:success', (event, data) ->
    $('#surrounding_container').html($(data))

$('.down_arrow')
  .bind 'ajax:success', (event, data) ->
    $('#surrounding_container').html($(data))

私のless.js.coffeeで。

私は何かを逃していますか？画像はまだ非同期に変更されません

4

1 に答える 1

1

いくつかのオプションがあります。レンダリングされたスコアを（js / jsonとしてではなく）返し、それを（周囲の）divタグに配置することをお勧めします。

このようにレイアウトなしでスコアをレンダリングします

render :score, :layout => false

次に、JavaScript (私の例では CoffeeScript) を使用して div タグのコンテンツを置き換えます

$('.up_arrow a')
  .bind 'ajax:success', (event, data) ->
    $('#surrounding_container').html($(data))

別の方法として、結果を json として返し、ページを手動で変更することもできますが、上記のオプションの方が手間がかからないと思います。

于 2012-04-17T07:13:33.987 に答える