Yii2模态高度问题

我一直在某种形式上使用bootstrap模态。我从this教程中了解到创建模态。对于我之前的项目，我对模态没有任何问题。但是对于我目前的项目来说，模态组织并没有完全覆盖模态内容。这里的截图我现在通过参考this解决了这个问题。我无法弄清楚什么可能导致身高问题。Yii2模态高度问题

我认为文件中的代码

<div class="collection-type-index"> 



<h1><?= Html::encode($this->title) ?></h1> 
<?php // echo $this->render('_search', ['model' => $searchModel]); ?> 

<p> 
    <?= Html::button('Create Collection', ['value' => Url::to('index.php?r=settings/collectiontype/create'), 'class' => 'btn btn-success', 'id' => 'modalButton']) ?> 
</p> 

     <?php // Modal for create 
      Modal::begin([ 
        'header'=>'Collection Type', 
        'id'=>'modal', 
        'size'=>'modal-lg', 
      ]); 

      echo "<div id='modalContent'></div>"; 

      Modal::end(); 

    ?> <!-- end modal --> 

<?= GridView::widget([ 
    'dataProvider' => $dataProvider, 
    'filterModel' => $searchModel, 
    'columns' => [ 
     ['class' => 'yii\grid\SerialColumn'], 

     'id', 
     'type', 
     'days', 
     'created_by', 
     'modified_by', 
     // 'status', 

     ['class' => 'yii\grid\ActionColumn'], 
    ], 
]); ?>

我控制器创建动作代码

public function actionCreate() { 
     $model = new CollectionType(); 

     $model->created_by = Yii::$app->user->identity->username; 
     if ($model->load(Yii::$app->request->post()) && $model->save()) { 
      return $this->redirect(['view', 'id' => $model->id]); 
     } else { 
      if (Yii::$app->request->isAjax) { 
       return $this->renderAjax('create', ['model' => $model]); 
      } else { 
       return $this->render('create', ['model' => $model]); 
      } 
     } 
}

我的js代码

$(function(){ 
$('#modalButton').click(function(){ 
    $('#modal').modal('show') 
     .find('#modalContent') 
     .load($(this).attr('value')); 
}); 

$('#modal').on('show.bs.modal', function() { 
    $('.modal-lg .modal-content').css('height',$(window).height()*0.55); 
}); 
});

正如我说我已经解决了问题由我们上面的JS脚本，但我不认为这是最好的解决方案，因为我必须手动设置每个模式的这种高度。什么可能导致这个问题？有没有人遇到过这个问题并解决？

来源

2016-11-18 gojiraki

这看起来像一个浮动问题。修改模态内生成的视图：

将此模态的内容包含在<div class="clearfix">和</div>之间。

这个观点的末尾添加<div class="clearfix"></div>。

来源

2016-11-18 09:23:21 Bizley

该解决方案解决了这个问题。 – gojiraki

Yii2模态高度问题

回答

相关问题