jquery : 동적으로 생성 된 테이블에 대화 상자가 표시되지 않습니다.

Question

struts2-jsp 응용 프로그램을 만들었습니다. 대화 상자 팝업창이 나타납니다. 클릭 할 때 하이퍼 링크를 편집 할 때마다 Jquery를 사용하여 편집 하이퍼 링크를 클릭 할 때 팝업 창이 나타납니다. . 첫 번째 편집을 클릭했을 때만 대화 상자가 팝업되고, 두 번째 및 다른 편집에서 레코드가 추가 될 때 동적으로 생성되는 대화 상자가 팝업되지 않는 문제가 있습니다.

JQuery와 코드는 다음과 같습니다

<script> 
$(document).ready(function(){ 
$("#todo").dialog({ autoOpen: false }); 
$("#dialogLink").click(function() { 
$("#todo").dialog('open'); 
}); 
}); 
</script> 

동적으로 테이블을 생성하는 코드는 다음과 같습니다

<div class="content"> 
     <table class="todoTable" cellpadding="5px"> 
      <tr class=even> 
       <th>TITLE</th> 
       <th>STATUS</th> 
       <th>EDIT</th> 
       <th>DELETE</th> 
      </tr> 

      <!--This will iterate through the todolist --> 
      <s:iterator value="gettodoList()" status="todoStatus"> 

       <tr class="<s:if test="#todoStatus.odd == true ">odd</s:if> <s:else>even</s:else>"> 

        <td><s:property value="title" /></td> 
        <td><s:property value="complete" /></td> 

        <!-- This will append the Id with the url --> 
        <td> 
        <a id="dialogLink" href="#">Edit</a> 
        </td> 
        <td><s:url id="deleteURL" action="deleteTodo"> 
            <s:param name="id" value="%{id}">      </s:param> 
         </s:url> <s:a href="%{deleteURL}">Delete</s:a> 
        </td> 
       </tr> 
      </s:iterator> 
      </tbody> 
     </table> 
    </div> 

Answer 1

당신은 대신에 이벤트 핸들러를 설정 .on()를 사용할 필요가 후자 인 .click()은 기존 노드에 이벤트를 첨부하는 반면 첫 번째 노드는 기존 노드와 새 노드에 이벤트를 연결합니다 .live()이

JQuery와

의 이전 버전에서 작동하는 데 사용 방법뿐만 아니라 유사은 당신이 id을 사용하고 있기 때문에하는 class를 사용하고 그것을 잘 작동합니다입니다) http://api.jquery.com/live/

Answer 2

(1)를보십시오.
&
2) 동적으로 생성 된 요소에 on()을 사용해야합니다.