Модальная прокрутка - PullRequest
       14

Модальная прокрутка

0 голосов
/ 26 февраля 2020
<!-- Modal -->
<div id="notification" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Test</h4>
      </div>
      <div class="modal-body">
        <div class="form-group">
            <label for="name">Name</label>
            <input name="name"  id="name" type="text" class="form-control input-sm pull-right" value="<?=$name?>" >
        </div>


      </div>
      <div class="modal-footer">
        <button type="button" class="btn web_btn input-sm" name="close" value="send" data-dismiss="modal" id="cancel" aria-hidden="true">Cancel</button>
        <button type="button" id="send" class="btn btn-primary web_btn input-sm" name="do" value="send">Send</button>

      </div>
    </div>

  </div>
</div>


function test() {
getinfo = true;
if (status=='0') {
    $modal = $('#notification')
    $modal.modal('show');
    $( "#send" ).click(function(ev) {
        send = true;
        if (send) {
            Status(id);
        }
    }) 

}   
if (getinfo)
        window.open("test.php?id="+id+"&action=test","_blank","width=300,height=500"); 

    }

В вышеприведенном случае появляются два диалоговых окна, одно находится в окне, а другое - в новом окне. Проблема в том, что диалоговое окно, которое появляется в окне, не прокручивается после его открытия, а вместо этого прокручивается главная страница позади диалогового окна. Поэтому я не могу прокрутить диалоговое окно и найти его полностью. Другие всплывающие окна в новом окне в порядке.

Я также попробовал это решение в случае, если я уменьшаю размер диалогового окна, но оно также не работает

$modal.modal('show', function () {
       $(this).find('.modal-dialog').css({
              width:'20px', 
              height:'20px',  
              'max-height':'30%'
       });
});

1 Ответ

0 голосов
/ 26 февраля 2020

Вы можете добавить

body.modal-open {
    overflow: hidden;
}

Читать это Предотвращение прокрутки тела при открытии модального окна

...