2013-06-25 2 views
1

나는 사용자 알림 시스템을 구현하고 있습니다. 페이지가로드되면 AJAX 요청이 이루어지고 알림이있는 경우 <ul>으로 렌더링되며 알림 항목을 클릭하면 표시됩니다.트위터 부트 스트랩 동적으로 드롭 다운 추가

내 페이지에는 부트 스트랩이 작동하는 몇 가지 드롭 다운 목록이 있으므로 문제는 아닙니다.

요소로드 및 생성이 올바르게 작동합니다. 방화범이 끌려서 확인하면 DOM에 나타납니다.

// this is in the top bar 
<a id="notifications" href="/user/profile/notifications" data-toggle="notifications-alert">Benachrichtigungen</a> 

// and this appended to the end of body 
<ul id="notifications-alert" class="notifications dropdown-menu" style="display: none;"> 
    <li class="event_new">[..]</li> 
    <li class="event_new">[..]</li> 
</ul> 

I는 내가 data-toggle 속성 설정의 첨부 드롭()를 초기화한다. 이와 같이 :

$notifications.addAttr('data.toggle', 'notifications-alert') 
       .dropdown(); 

수동 트리거로 시도했지만 여전히 작동합니다.

$notifications.addAttr('data.toggle', 'notifications-alert') 
       .click(function(e) { e.preventDefault(); $(this).dropdown('toggle'); }) 
       .dropdown(); 

왜 작동하지 않는가?

@ EDIT : 내 실수. 자세한 내용은 내 대답을 참조하십시오.

답변

1

예 : twitter bootstrap의 모든 예는 링크 [태그 a]와 드롭 다운 [태그 ul]을 같은 부모와 함께 보여줍니다. 어쩌면 쉬운 솔루션은 신체의 끝 부분에 UL을 추가하는 대신 UL를 추가해야한다는 것입니다 $('a selector').after(ul)

관련 문제