Yii2 两个 DetailView 并排
Yii2 two DetailView side by side
我正在制作一个将 PO 导出为 PDF 的采购订单系统,但我需要在上半部分显示来自买方和卖方的数据。
我想并排放置 2 个 DetailView,每个都有 50% 的页面宽度。
有可能的?到目前为止,我还没有找到任何关于此的信息,而且我的 CSS 技能很低。
感谢您提供任何信息。
您可以取消 bootstrap 网格
在视图中,您可以将 detailView 放在两个单独的 bootstrap 列中
<div class="col-sm-6 col-md-6 col-lg-6" >
<?= DetailView::widget([
'model' => $modelBuyer,
......
?>
</div>
<div class="col-sm-6 col-md-6 col-lg-6" >
<?= DetailView::widget([
'model' => $modelSeller,
......
?>
</div>
在控制器中简单地传递渲染中的两个模型
return $this->render('your_view', [
'modelBuyer' => $modelBuyer,
'modelSeller' => $modelSeller,
]);
我正在使用 mpdf 的 kartik mpdf 包装器。我注意到 kv-mpdf-bootstrap.min.css 没有将 "col-sm-6" 定义为 bootstrap.css 中的 50%。由于文档建议 mpdf css 覆盖 bootstrap 我发现 class "col-xs-5" 指定 41.6666% 这适合我的输出要求并允许我接下来显示两个详细视图彼此。
<form class="form-inline">
<div class="form-group">
<div class="col-xs-5">
<p><b>Bill To</b></p>
<div style="border: 1px solid grey; padding-left: 10px; padding-right: 10px; padding-top: 5px; padding-bottom: 5px; width:200px">
<?= DetailView::widget([
'model' => $model,
'bootstrap' => false,
//'condensed'=>true,
//'striped' => false,
//'bordered' => true,
'labelColOptions' => ['hidden' => true],
'attributes' => [
'company',
'billStreetAddress',
[
'attribute' => 'billStreetAddress2',
'visible' => (!empty($model->billStreetAddress2)),
],
'billCity',
'billPostalcode'
]
])
?>
</div>
</div>
<div class="col-xs-5" >
<p><b>Ship To</b></p>
<div style="border: 1px solid grey; padding-left: 10px; padding-right: 10px; padding-top: 5px; padding-bottom: 5px; width:200px">
<?= DetailView::widget([
'model' => $model,
'bootstrap' => false,
'labelColOptions' => ['hidden' => true],
'attributes' => [
'company',
'shipStreetAddress',
[
'attribute' => 'shipStreetAddress2',
'visible' => (!empty($model->billStreetAddress2)),
],
'shipCity',
'shipPostalcode'
]
])
?>
</div>
</div>
</div>
我正在制作一个将 PO 导出为 PDF 的采购订单系统,但我需要在上半部分显示来自买方和卖方的数据。 我想并排放置 2 个 DetailView,每个都有 50% 的页面宽度。 有可能的?到目前为止,我还没有找到任何关于此的信息,而且我的 CSS 技能很低。 感谢您提供任何信息。
您可以取消 bootstrap 网格 在视图中,您可以将 detailView 放在两个单独的 bootstrap 列中
<div class="col-sm-6 col-md-6 col-lg-6" >
<?= DetailView::widget([
'model' => $modelBuyer,
......
?>
</div>
<div class="col-sm-6 col-md-6 col-lg-6" >
<?= DetailView::widget([
'model' => $modelSeller,
......
?>
</div>
在控制器中简单地传递渲染中的两个模型
return $this->render('your_view', [
'modelBuyer' => $modelBuyer,
'modelSeller' => $modelSeller,
]);
我正在使用 mpdf 的 kartik mpdf 包装器。我注意到 kv-mpdf-bootstrap.min.css 没有将 "col-sm-6" 定义为 bootstrap.css 中的 50%。由于文档建议 mpdf css 覆盖 bootstrap 我发现 class "col-xs-5" 指定 41.6666% 这适合我的输出要求并允许我接下来显示两个详细视图彼此。
<form class="form-inline">
<div class="form-group">
<div class="col-xs-5">
<p><b>Bill To</b></p>
<div style="border: 1px solid grey; padding-left: 10px; padding-right: 10px; padding-top: 5px; padding-bottom: 5px; width:200px">
<?= DetailView::widget([
'model' => $model,
'bootstrap' => false,
//'condensed'=>true,
//'striped' => false,
//'bordered' => true,
'labelColOptions' => ['hidden' => true],
'attributes' => [
'company',
'billStreetAddress',
[
'attribute' => 'billStreetAddress2',
'visible' => (!empty($model->billStreetAddress2)),
],
'billCity',
'billPostalcode'
]
])
?>
</div>
</div>
<div class="col-xs-5" >
<p><b>Ship To</b></p>
<div style="border: 1px solid grey; padding-left: 10px; padding-right: 10px; padding-top: 5px; padding-bottom: 5px; width:200px">
<?= DetailView::widget([
'model' => $model,
'bootstrap' => false,
'labelColOptions' => ['hidden' => true],
'attributes' => [
'company',
'shipStreetAddress',
[
'attribute' => 'shipStreetAddress2',
'visible' => (!empty($model->billStreetAddress2)),
],
'shipCity',
'shipPostalcode'
]
])
?>
</div>
</div>
</div>