onsubmit в Twitter Bootstrap модальный не получает срабатывает

Question

код прост:

HTML:

<div class="modal dialog-add-category fade" role="dialog" aria-labelledby="dialogAddCategoryLabel"> 
    <form onsubmit='alert("444")'> 
     <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
        <h4 id="dialogAddCategoryLabel" class="modal-title">Add a category</h4> 
       </div> 
       <div class="modal-body"> 
        <input type="text" name="category_name" placeholder="Category name"/> 
        <div class="parent-category-tree"></div> 
       </div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
        <button type="submit" class="btn btn-primary" data-dismiss="modal">Create</button> 
       </div> 
      </div> 
     </div> 
    </form> 
</div> 

JS:

$(function() { 
    $('.dialog-add-category').modal('show'); 
}); 

Вот концертная версия: http://jsfiddle.net/ygbhousz/1/

Как вы можете видеть, в форме есть событие onsubmit, но оно не срабатывает. Почему это происходит и что я могу сделать, чтобы достичь этих целей:

• клавишу Esc и кнопку Отмена следует закрыть модальный
• Введите ключ и кнопку отправки должен представить форму (показать предупреждение), а затем закрыть modal

?

Answer 1

Пожалуйста, не используйте onsubmit, вы сделали ошибку перед кнопкой отправки, вы должны удалить data-dismiss="modal". Тогда нет функции для вызова события на отправить, поэтому добавить код

$(document).on('click', '[type="submit"]', function() { 

    alert('444'); 

}); 

Updated Fiddle