2013-10-10 10 views
0

나는 이것이 자주 제기되는 질문이라는 것을 알고 있습니다. 그러나 그 답은 만족스럽지 않습니다.부트 스트랩 모달 파괴 방법

부트 스트랩 모달을 숨긴 후에 재설정/다시 초기화 할 수 없습니다.

다른 스레드 중 하나에서 제안한 것처럼, 나는 다음과 같은 코드가 있습니다 모달가 다시 표시되면,이 후

$('#myModal').on('hidden', function() { 
    $(this).data('modal', null); 
}); 

을 이전 쇼에 추가 된 내용은 여전히 ​​남아있다. , 클릭 "변경 내용 저장"는 모달 일부 동적 요소를 추가 할 경우, 모달가 처음 표시 한 후

  1. : 여기

    문제를 보여줍니다 jsfiddle link입니다.
  2. 그런 다음 닫기 버튼을 클릭하면 모달이 숨겨집니다.
  3. 모달을 다시 호출하면 이전 호출 중에 동적으로 추가 된 요소가 표시됩니다.

이 모달을 재설정하는 가장 좋은 방법은 무엇입니까? 앞서 지적한 바와 같이

, 아래의 코드는 작동하지 않습니다

$(this).data('modal', null); 

다른 대안은 수동으로 원래 상태로 필드를 다시 설정하는 것입니다.

그러나 실용적인 애플리케이션에서는 모달에 많은 동적 요소와 복잡한 요소가 생성되므로 재설정하는 옵션이 지루합니다.

답변

1

모달은 입력란을 인식하지 못합니다. jQuery를 객체의 배열이 취소 당신은 당신이 그것을 줄 부트 스트랩 모달에 대한 사용자 지정 래퍼를 만들 수

$('#myModal').on('hidden', function() { 
    $('inputEmail').val(null); 
}); 

: 수동으로 숨겨진 이벤트 내에서 그 선택을 취소해야합니다

var myModal = function (id, inputs) { 
    $(id).on('hidden', function() { 
     $.each(inputs, function(i, input) { 
      input.val(null); 
     }); 
    }); 
    return $(id).modal(); 
}; 

이것은 단지입니다 대략적인 아이디어 ....

가장 좋은 방법은 Knockout.js, Angular.js, Backbone.js 등과 같은 JavaScript 프레임 워크를 사용하는 것입니다. 그들은 비슷한 이벤트 문제로 당신을 정말로 도울 수 있습니다.

+0

Thx. 나는 모달의 상태를 복원하기 위해 내 fn을 썼다. 그러나 그것은 정말로 고통 스러웠다. –