2014-12-19 4 views
0

У меня есть jquery на мероприятии, чтобы передать некоторые данные в модальное окно загрузки. Вот код из модального:JQuery .on event not firing

<div class="modal fade" id="renameFile" tabindex="-1" role="dialog" aria-labelledby="renameFile" aria-hidden="true"> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">close</span></button> 
      <h4 class="modal-title" id="formRenameTitle">rename</h4> 
     </div> 
     <div class="modal-body"> 
      <form method="post" th:action="files"> 
       <div class="input-group"> 
        <input type="text" class="form-control" id="fileName" name="fileName" /> 
        <span class="input-group-btn"> 
         <button class="btn btn-default" type="submit">rename</button> 
        </span> 
       </div> 
       <input type="hidden" name="action" value="EDIT" /> 
       <input type="hidden" name="fileId" /> 
      </form> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">close</button> 
     </div> 
    </div> 
</div> 
</div> 

и вот код для кнопки (она обычно живет в клетке сетки):

<a data-toggle="modal" data-id="${{file.id}}" data-name="${{file.name}}" title="rename" class="open-renameFile" href="#renameFile"> 
    <span class="glyphicon glyphicon-pencil" aria-hidden="true</span>rename 
</a> 

Я использую thymeleaf для заполнения ячеек каждый ряд.

И в нижней части страницы, я включил этот JavaScript:

<script type="text/javascript"> 
$(document).on("click", ".open-renameFile", function() { 
    var fileName = $(this).data('name'); 
    $(".modal-body #fileName").val(fileName); 
}); 
$(document).on("click", ".open-renameFile", function() { 
    var fileId = $(this).data('id'); 
    $(".modal-body #fileId").val(fileId); 
});  
</script> 
+0

Как вы узнали, что события не уволены? Вы уверены, что ваши 'id' уникальны в документе? Я имею в виду, что селектора типа '.modal-body # fileXXXX' не имеют смысла. Просто используйте '# fileXXXX'. – Teemu

+0

Я бросил предупреждение в скрипте, и он так и не появился. Кроме того, поле не заполняется. – cscan

ответ

0

Не уверен, что точка вашего кода, как вы на самом деле не делать ничего с Валу? Но попробуйте следующее:

<script type="text/javascript"> 
$('.open-renameFile').click(function() { 
    console.log('Event fired!'); 
    var fileName = $(this).data('name'); 
    $(".modal-body #fileName").val(fileName); 
    var fileId = $(this).data('id'); 
    $(".modal-body #fileId").val(fileId); 
});  
</script> 
+0

Это все еще не сработало. Кроме того, я использую значения в своем Post, мне нужны они на стороне сервера для обновлений базы данных. – cscan

+0

Строка печаталась на консоль? – Usmann

+0

Нет, ничего не было напечатано на консоли. – cscan