2016-09-19 8 views
1

Я создал приложение struts2-jsp, я хочу, чтобы диалоговое окно всплывало dialog pop up всякий раз, когда редактировалась гиперссылка в щелчке, я использую JQuery, чтобы открыть диалоговое окно при нажатии на ссылку «Редактировать гиперссылку» , Проблема заключается в том, что диалоговое окно появляется только при первом щелчке правой кнопкой мыши, во втором и других изменениях, которые генерируются динамически, когда диалоговое окно с добавлением записи не появляется.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> 

client side html is

+0

Возможный дубликат [привязка события к динамически созданным элементам?] (Http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements) – vijayP

+0

также 'id' не может быть дублировано в единый документ. Попробуйте дать «класс» вместо «id» и связать событие с помощью метода делегирования событий. – vijayP

+0

убедитесь, что код jquery выполняется после обновления таблицы. возможно, код jquery выполняется только один раз в начале – Chandru

ответ

1

Вы должны использовать .on(), чтобы установить обработчик событий вместо .click(), поскольку последний присоединяет событие только к существующим узлам, а первый присоединяет его к существующим узлам и новым а также аналогично тому, как .live() привыкли работать в более ранних версиях JQuery

взглянуть на http://api.jquery.com/live/

+0

. Я использовал .on()

0

1) это происходит потому, что вы используете id, используйте class и он должен работать нормально.
&
2) вы должны попытаться использовать on() для динамически генерируемых элементов.

Смежные вопросы