2013-06-13 3 views
0

관련 질문 : Nested Model Form입니다. .add_fields 버튼을 클릭하여 date-picker이라는 새 필드를 text에 추가하고 싶습니다. 새로 생성 된 필드는 동일한 클래스 이름이고 다른 ID입니다. 내 문제는 : 날짜 선택 도구가 나타나지 않고 새 필드에 '.add_fields'클래스 버튼을 클릭하는 것입니다. 내 커피 스크립트 코드는 다음과 같습니다 당신은 새로 추가 된 필드는 같은 클래스가 있지만, 그들과 함께 첨부 된 날짜 선택기가되지 않습니다하지만 날짜 선택기가 부착되면서, 버튼의 클릭에 DOM에 새 필드를 추가Datepicker가 여러 번 표시되지 않습니다.

$('form').on 'click', '.add_fields', (event) -> 
    time = new Date().getTime() 
    regexp = new RegExp($(this).data('id'), 'g') 
    $(this).before($(this).data('fields').replace(regexp, time)) 
    event.preventDefault() 

답변

1

클래스 요소가 DOM에 추가되기 전에 해당 클래스 요소에 적용됩니다.

동적으로 추가 된 필드에 datepicker를 첨부하려면 먼저 제거한 다음 다시 첨부해야합니다. 예 : 당신이 클래스 datepicker 필드가 있고 당신이 당신의 자바 스크립트 코드를 변경해야하는 경우 :

$('form').on 'click', '.add_fields', (event) -> 
    time = new Date().getTime() 
    regexp = new RegExp($(this).data('id'), 'g') 
    $(this).before($(this).data('fields').replace(regexp, time)) 

    //remove the hasDatepicker class from the fields and re-intialise datepicker. 
    $('.datepicker').removeClass('hasDatepicker').datepicker({dateFormat: 'yy/mm/dd'}) 
    event.preventDefault() 
+0

감사합니다. 내게 맞습니다. –

+0

안녕하십니까. @GaneshKunwar :) –

2

나는 당신의 data('fields')의 내용을 알지 못한다. 텍스트 입력란이 있어야합니다. 맞습니까?

data('fields')에서 새 DOM 요소를 삽입 한 후에는 날짜 선택기 초기화 할 수 있습니다

$(this).before($(this).data('fields').replace(regexp, time)).find('.date-picker').datepicker() 

P.S을 : 나는 $(this).before(content) 반환 $(this) 또는 $(content) (jQuery를의 다큐는 설명하지 않습니다) 여부를 모르겠어요. 어쩌면 find을 조정해야합니다.

+2

BTW : Manjo의 답변으로 ** 모든 ** datepickers가 페이지에 다시 삽입되었습니다.이 코드는 새로 삽입 된 카드 만 초기화합니다. –

+0

당신은 맞습니다 @ 마틴 :) –

관련 문제