레일 : jQuery를 통해 has_many : through 관계를 업데이트하는 방법?

Question

죄송합니다, 이것이 멍청한 질문이라면, 레일즈와 jQuery를 시작하기 만하면됩니다. 다음과 같은 시나리오가 있습니다 :

연락처, 회사 및 contact_company_joins (ccj)의 세 가지 클래스가 있습니다. 세 가지 클래스 모두에 대해 모델, 컨트롤러 및 뷰를 만들었습니다. 분명히 연락처와 회사는 join-table ccj를 통해 연결됩니다 (has_many : through 사용).

연락처 < -> contact_company_joins < -> 회사 내 연락처의 "쇼"보기에서

나는 연락처가 연결되어 모든 기업을 나열하는 테이블 (그리고 회사 자체 예에 대한 몇 가지 추가 정보를 표시 할 전화 번호). 우리 회사의 견해에서 나는 같은 것을하고 싶지만, 이번에는 직원들의 (연락처) 세부 사항을 원합니다. 두보기에서

$('.edit_contact_join_delete').livequery('click', function() { 
    var $deleteButton = $(this); 
    var answer = confirm("Sure?"); 
    var dataloc = "&_method=delete"; 
    if (answer) { 
    $.ajax({ 
      type : "POST", 
      url : this.href, 
      data : dataloc, 
      success: function(result) { 
      } 
     }); 
    } 
    return false; 
    }); 

(연락처 및 기업), 삭제 조치 : 테이블의 각 행은 그 기능을 내가 지금 내 jQuery를 함수 중 하나에 매여 한 끝에 전형적인 "삭제"링크를 가지고 나를 ccj 컨트롤러의 파괴 기능으로 데려 간다. 지금하고 싶은 일은 삭제 기능을 호출하는 개별 사이트 (연락처 또는 회사)의 테이블을 업데이트하거나 다시 렌더링하는 것입니다. 단, 테이블의 일부만입니다. 위의 "성공"기능에서 구현해야한다고 생각하십니까? 하지만 다시 한 번, ccj 컨트롤러 (렌더링 된 부분)에서 뭔가를 반환하더라도 ... 연락처와 회사보기 모두에 대해 동일하게 적용 할 수 있습니까? Ajax 호출을 통해 ccj 객체를 삭제 한 후 새 연락처 테이블 (새 회사 테이블)에 대한 새로운 DOM 객체를 얻을 수 있지만 Ajax 호출을 할 때 신선한 연락처 테이블을 가져올 수 있는지 확인하려면 어떻게해야합니까? 내 회사보기 에서요?

희망이 모두 의미가

감사합니다,

세바스찬 :-)

Answer 1

당신이 필요로 성공 또는 (할 것입니다 심지어 단지 true 또는 false) 실패를 반환하는 삭제 작업입니다 그러면 자바 스크립트가 응답을 처리 할 수 ​​있습니다.

오류가 발생하면 성공 및 관계가 삭제 된 경우 페이지에서tr > 삭제 링크의 상위를 찾아 행을 페이드 아웃하여 결국 페이지에서 삭제할 수 있습니다. 예를 들어 (컨트롤러가 삭제가 성공하면 true를 반환하고 그렇지 않으면 false를 반환하면) :

$('.edit_contact_join_delete').livequery('click', function() { 
    var $deleteButton = $(this); 
    var answer = confirm("Sure?"); 
    var dataloc = "&_method=delete"; 
    if (answer) { 
    $.ajax({ 
      type : "POST", 
      url : this.href, 
      data : dataloc, 
      success: function(result) { 
      if (result) { 
       // handle successful delete 
       $deleteButton.parent('tr').fadeOut().remove() 
      } else { 
       // handle failed delete 
       alert('Delete failed'); 
      } 
      } 
     }); 
    } 
    return false; 
    });