JQuery UI Draggable Modal

Question

У меня есть модальный с функцией перетаскивания. Он отлично работает, но когда я закрываю и снова открываю модальный, он сохраняет свою последнюю позицию. Например, если я перетащил модальный в нижнюю часть окна и закрою его, когда я снова открою модальный, это находится в нижней части окна. Мне нужно, чтобы это было сосредоточено, поскольку это был первый раз, когда он был запущен. Я использую JQuery UI и Bootstrap здесь.

Вот мой код:

<div class="outerContainer"> 
.... 
.... 
     <!-- Modal --> 
      <div class="modal fade" id="alertModal" tabindex="-1" role="dialog" aria-labelledby="alertModalLabel" aria-hidden="true"> 
       <div class="modal-dialog" id="contentModal"> 
        <div class="modal-content"> 
         <div class="modal-header"> 
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
          <h4 class="modal-title" id="alertModalLabel">Add Alert</h4> 
         </div> 
         <div class="modal-body"> 
          <div class="container-fluid"> 
           @Html.Partial("~/Views/Shared/Maintenance/_AddAlert.cshtml", Model.AlertViewModel); 
          </div> 
         </div> 
         <div class="modal-footer"> 
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
          <button type="button" class="btn btn-primary">Save changes</button> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 

    <script> 
    $(function() { 
      $("#alertModal").draggable({ 
       handle: ".modal-header", 
       scroll: false, 
       containment: '#outerContainer' 
      }); 
     }); 
    </script> 

Answer 1

При закрытии/открыть его можно подключить в модальных событий и повторно позиции соответственно:

$('#alertModal').on('hidden.bs.modal', function (e) { 
    // reposition modal according to window/viewport here 
}); 

См bootstrap docs, где он говорит о закреплять в событиях ,

НТНЫ