2011-01-02 2 views
1

누구나 학습을위한 조언이 있다면 (예 : 튜토리얼을 알고 있다면) 뷰 페이지 링크를 클릭하면 인덱스 페이지에서 "show"뷰를 원격으로로드 할 수 있습니까? 보기가 링크 제목 아래에 나타나기를 바랍니다.인덱스 페이지에서 아약스를 통해 레코드 보이기?

보다도, 엘리엇

컨트롤러에서

답변

1

, 원하는 항목에 대한 부분 렌더링 : 다음

def show 
    @item = Item.get(params[:id]) 
    respond_with (@item) do |format| 
    format.html{ render :partial => 'item' } 
    format.js{ render :partial => 'item', :layout=>false } 
    end 
end 

그리고 jQuery를 사용하여, 당신은 할 수 :

$('a#my_loader').bind('click', function(){ 
    $.ajax({url: "/items/1", 
      type: "GET", 
      success: function(data) { 
      $('#items').append(data); 
      } 
    }); 
}); 

당신은 것 ID 'my_loader'가있는 태그와 'items'의 ID가있는 div 또는 ul이 필요합니다.

+0

나는 그가 링크 제목 바로 아래에 나타 내기를 원한다는 것을 알아 차릴 것이라는 점을 주목한다. $ .ajax의 문맥에서 '$ (this)'가 무엇을 참조하는지 확신 할 수 없다.) 호출이 성공 함수를 따로 따로 정의하면 $ (this)를 사용할 수있게되거나 바운드 함수가'event' 매개 변수를 받아 들일 수 있고 그 방법으로 링크를 타겟팅 할 수 있습니다. – Samo

0

나는 stef가 제안한 것처럼 약간의 수정을 가했지만 그렇게 할 것입니다.

$('a#my_loader').click(function() { 
    var success = function(response) { 
    $(this).append(response); 
    } 

    $.get("items/" + $(this).attr('item_id'), success); 

} 

이 타겟팅하는 개체의 id은 물론 item_id

로 알려진 당신의 연결의 속성에 저장되어 있다고 가정합니다, 당신은 HTML이 이미 있는지 여부를 확인 할 수 있습니다 AJAX 호출을하기 전에 호출을하지 않고 부분을 두 번 추가해야합니다.

관련 문제