AJAX 성공 후보기에서 요소 변경

Question

AJAX에 관해서는 약간의 도움이 필요할 때 총 초보자입니다. posts_controller와 likes_controller가 있습니다.

사용자가 게시물을 '좋아하거나'좋아할 수 있습니다. 지금은 AJAX를 구현하여 사용자가 게시물을 '좋아할 때마다'또는 '좋아지지 않음'할 때마다 like/unlike가 전환되도록하려고합니다.

AJAX 이전에는 페이지가 새로 고침되고보기의 코드가 주어진 게시물이 현재 사용자에게 마음에 들었는지 여부를 결정합니다. 보기에서 if 문을 실행했는데 결과에 따라 두 가지 양식이 표시되었습니다. 게시물이 아직 마음에 들지 않았 으면 게시물을 '좋아'(작업 작성) 할 양식이 있고, 게시물이 이미있는 경우 좋아, 거기에 게시물 ('행동을 파괴') '과 달리'형태가되었습니다.

AJAX를 사용하여 생성 부분을 구현 했으므로 동적으로 발생하지만보기가 변경되지 않습니다 (터미널/레일 콘솔을 통해 생성 된 것처럼 볼 수 있지만 링크의 텍스트는 동일하게 유지됩니다). 페이지를 새로 고치지 않고보기를 업데이트하는 가장 좋은 방법은 무엇입니까? AJAX를 통해 '유사'링크와 양식을 업데이트해야합니다. jquery를 통해이 작업을 수행하는 유일한 방법은 무엇입니까?

%ul.dropdown-menu 
    %li 
    - if current_profile.like?(post) 
     = form_for current_profile.likes.find_by_likee_id(post), :html => { :method => :delete } do |f| 
     %a{:href => "javascript:void(0)", :onclick=>"$(this).closest('form').submit()"} 
      %i.icon-heart.icon-large{:style => "color: #fedc73;"} 
      Unlike this Post 
     - else 
     = form_for current_profile.likes.build(:likee_id => post.id), :remote => true do |f| 
      = f.hidden_field :likee_id 
      %a{:href => "javascript:void(0)", :onclick=>"$(this).closest('form').submit()"} 
      %i.icon-heart-empty.icon-large 
      Like this Post 

create.js.haml 파일 :

는

:plain 
    $(this).closest('form').submit() 

어떤 도움은 매우 될 것 뷰의 조각

class LikesController < ApplicationController 

    def create 
    @post = Project.find(params[:like][:likee_id]) 

    respond_to do |format| 
     format.html{ 
     current_profile.like!(@post) 
     redirect_to :back 
     } 
     format.js { 
     current_profile.like!(@post) 
     } 
    end 

    end 
    def destroy 
    @post = Like.find(params[:id]).likee 
    current_profile.unlike!(@post) 
    redirect_to :back 
    end 
end 

likes_controller : 여기

내 코드입니다 고맙습니다. 정말 고맙습니다!

Answer 1

당신은

$.post('url', data, function(returned_data){ $.('like_div').html(returned_data) }) 

를 사용할 수 있습니다하지만 그 대신 수동으로 링크를 작성, 당신은 레일 하나 생성 할 수 : JS를 사용할 경우에도,

가

= link_to url_for(...), :remote => true 

이 작동을, ADN 당신이 돈 ' 이것을 위해 어떤 형식이 필요하지 않습니다.

- if current_profile.like?(post) 
    = link_to url_for(:controller => :posts, :action => :unlike, :id => post.id), :remote => true 
- else 
    = link_to url_for(:controller => :posts, :action => :like, :id => post.id), :remote => true 

물론이 작업 된 .js하고, .html 파일에 응답해야합니다. 이후에는 전체보기를 렌더링 할 수 있고 .js에서 링크 div를 새로 고친 js로 변경하는 j 조각을 삽입 할 수 있습니다. 더 이상 설명이 필요합니까?