2012-04-04 2 views
0

내 레일 앱에서 Jquery TokenInput을 사용하여 사용자가 정보를 빨리 입력하는 데 도움이됩니다. 각 사용자는 동일한 클래스의 많은 항목이있는 프로필이 있습니다. 해당 항목은 college_items입니다. 각 college_item에는 자체 수정 링크가 있으며,이 링크는 모달에 적합한 편집 양식이있는 모달을 표시합니다. 페이지에서 동일한 JQuery 토큰 입력 상자를 여러 번 사용하기

나는 라이언 베이츠의 스크린 캐스트를 따라 다음과 같은 코드를 사용하여 제대로 작동 TokenInput을 가지고 :
application.js에서 : 내보기에서

$(function() { 
$("#education_major_tokens").tokenInput("/majors.json", { 
    theme: "facebook" 
    }) 
}); 

: 내 모델에서

<%= f.text_field :major_tokens %> 

을 :

def major_tokens=(ids) 
self.major_ids = ids.split(",") 
end 


내가 겪고있는 문제는이 동일한 필드가 각 편집 양식에 나타나므로 첫 번째 항목의 편집 양식에서 모든 것이 완벽하게 작동하지만 다른 항목의 편집 양식에서는 javascript가 초기화되지 않는다는 점입니다. 내 질문에 어떻게 자바 스크립트를이 양식 요소가 나타날 때마다 초기화 할 수 있습니까?

편집 : 는이 같은 일이 해결책이 될 거라고 생각 :

$(function() { 
$("#education_major_tokens").each(function(){ 
    $(this).tokenInput("/majors.json", { 
    theme: "facebook" 
    }) 
    }); 
}); 

하지만 여전히 나를 위해 작동하지 않습니다. 누구든지 아이디어가 있으십니까?

편집 2 : 마지막으로 알아 냈습니다. #education_major_tokens 대신 #education_major_tokens를 사용하는 대신 각 입력에 class => "major_input"을 설정하고 코드에서 "#education_major_tokens"를 ".major_input"으로 변경했습니다.

답변

1

조금 늦은 것 같습니다. 하지만,이

$(function() { 
$(".yourtokenfield").each(function(){ 
    $(this).tokenInput("/majors.json", { 
    theme: "facebook" 
    }) 
    }); 
}); 

내가 당신의 문제는 클래스에 대한 부적절한 이름 때문이 생각하는 사용 후 토큰 필드

<input class="yourtokenfield" type="text" /> 

에 클래스를 할당하려고하고 ID는 한 번 나타나야 기억하여 HTML 문서.

관련 문제