jquery에서 JPanel을 동적으로 만드는 방법은 무엇입니까?

Question

xml 콘텐츠에서 동적으로 접을 수있는 패널에 jPanel을 사용하려고하지만 동적으로 생성 된 패널이 표시되지 않습니다. 이 너무

나에게 도움이

:

<div id="detailTable" style="width:100%;"> 

</div> 

<!--Creating panels (Same thing if i create manually it is created, see the image)--> 
<div title="General Properties" class="class"> 
      ad 
</div> 
<div title="Other Properties" class="class"> 
    ad1 
</div> 

jQuery를

$('.class').jPanel({ 
     'effect' : 'fade', 
     'speed'  : 'slow', 
     'easing' : 'swing' 
    }); 


//when the user clicks on `Server` (left hand side) the below code is triggered 
$('#detailTable').empty(); 
    $('<div>') 
    .html('<div class="titleBlue">Configuration&gt;'+productname+'&gt;Server</div>'+ 
      '<div title="General Properties" class="class">'+ //Creating panels dynamically 
       '<table style="border:#2F5882 1px solid;width:100%;" cellspacing="1" cellpadding="1">'+ 
        '<tbody>'+ 
         '<tr>'+ 
          '<th style="width:22%" align="left">Version</th>'+ 
          '<td style="align="left">'+infa9_pm_version+'</td>'+ 
         '</tr>'+ 
        '</tbody>'+ 
       '</table>'+ 
      '</div>'+ 
      '<div title="Other Properties" class="class">'+ 
       '<table style="border:#2F5882 1px solid;width:100%;" cellspacing="1" cellpadding="1">'+ 
        '<tbody>'+ 
         '<tr>'+ 
          '<th style="width:22%" align="left">Home</th>'+ 
          '<td style="align="left">test</td>'+ 
         '</tr>'+ 
        '</tbody>'+ 
       '</table>'+ 
      '</div>')  
    .appendTo('#detailTable'); 

업데이트를

내 컨테이너 아래 이미지 참조

$('#detailTable').empty(); 
    $('<div>') 
    .html('')  
    .appendTo('#detailTable').delay(10).queue(function(){ 
     $('.class').jPanel({ 
      'effect' : 'fade', 
      'speed'  : 'slow', 
      'easing' : 'swing' 
     }); 
    }); 

Answer 1

동적으로 내용을 추가 할 때 JQuery live을 사용해야합니다.

프로토 타입은 클릭에 클래스에 JPanel을 연결하는 -

$('.class').live('click', function(){ 
    $(this).jPanel({ 
     'effect' : 'fade', 
     'speed'  : 'slow', 
     'easing' : 'swing' 
    });.focus(); 
    $(this).removeClass('class'); 
}); 

JQuery와 trigger를 사용하여 프로그래밍 트리거하려면.

$('.class').trigger('click'); 

Answer 2

당신은 한 동적 콘텐츠가 아약스 또는 경우에 다시 호출 (에 의해 생성되지 않는 아약스 성공 콜백에서 JPanel의 방법을 개시 동적 콘텐츠 후 시작 패널을 가지고 다음과 같은 작업을 수행 할 수 방법). 목적은 내가 다음 JPanel의 릴리스에서 이러한 시나리오에 대한 기본 처리기를 구현하려고합니다

$('#detailTable').empty(); 
$('<div>') 
.html('')  
.appendTo('#detailTable').find('selector').jPanel({ 
     'effect' : 'fade', 
     'speed'  : 'slow', 
     'easing' : 'swing' 
    }); 

다른 entireley가 여기에 선택은 내가 지연을 사용하여 선호 대기하지 않습니다 클래스 또는 패널에 사용하는 ID되고.