번호 동적으로 생성 된 누에 고치 필드

Question

저는 Cocoon gem을 사용하여 레일에 중첩 된 필드를 동적으로 생성했습니다. 나는 고치에 의해 생성 된 필드에 수치 적으로 레이블을 붙이고 싶은 곳에 응용 프로그램을 실행했습니다. 다음과 같습니다.

Field 1: __________ 
Field 2: __________ 
Field 3: __________ 

은 내가 내 자신의 자바 스크립트를 작성하여 무력 수 내려고하지만이 내장 된 날 이렇게 도움이 될 기능?

모든 안내에 많은 시간을드립니다.

Answer 1

JavaScript가 반드시 필요한 것은 아닙니다. 마크 업에 따라 중첩 된 필드를 래핑하고 CSS 카운터를 사용하여 번호 매기기를 수행 할 수 있습니다. 또한 항목을 제거하면 항목의 번호가 자동으로 다시 매겨집니다. 이 HTML을 고려

<div class="fields"> 
    <div class="field">Nested fields</div> 
    <div class="field">Nested fields</div> 
</div> 

를 함께 다음과 같은 CSS로, 모든 .field 전에 Field <idx>:있을 것입니다.

.fields { 
    reset-counter: idx; 
} 

.field { 
    counter-increment: idx; 
} 

.field:before { 
    content: "Field " counter(idx) ":"; 
} 

당신은 content의 값하지만 당신은 "요소"그러나 당신이 (특히 위치를) 원하는 스타일을 할 수 이외의 내부에 직접 HTML을 넣을 수 없습니다.

Answer 2

방금 ​​전에이 같은 문제가 있었지만 기본적으로 새로 삽입 한 필드의 레이블을 업데이트해야합니다. Update field inside fields_for with Cocoon and Jquery

은 내가 한 것은 내 커피 스크립트 파일이 추가했다 : 나는이 질문에 대한 답을 발견 당신은 또한 필드 중 하나를 제거하면 라벨을 편집해야

$('#fields').on('cocoon:after-insert', (e, inserted_item) -> 
    num = $('.fields').length 
    inserted_item.find('.field-label').html('Field #'+num) 
) 

을, 그러나 나는 천국 ' 그 문제를 아직 처리하지 못했습니다.