Question

我想将表格字段并排放置在Yii2中，格式为2x2。

我正在使用bootstrap / ActiveForm

    <?php $form = ActiveForm::begin([
    'layout' => 'horizontal',
    'action' => ['index'],
    'method' => 'get',
    'fieldConfig' => [
        'horizontalCssClasses' => [
            'label' => 'col-sm-2',
            'offset' => 'col-sm-offset-2',
            'wrapper' => 'col-sm-4',
        ],
    ],
]); ?>

这些字段基本上是一系列日期小部件

<?= $form->field($model, 'saleFrom')->widget(DatePicker::className(), [
    'options' => ['placeholder' => 'TO'],
    'pluginOptions' => [
        'autoclose' => true,
        'format' => 'yyyy-mm-dd'
    ]
]); ?>

然而，所有设法做的就是将所有四个字段对齐div的左边 - 我无法从文档中找出如何使用Yii2选项来执行此操作而无需手动添加自定义css。

Answer 1

您只需将表单列包装在另一个引导程序row中。

<?php $form = ActiveForm::begin([
    'layout' => 'horizontal',
    'action' => ['index'],
    'method' => 'get',
    'fieldConfig' => [
        'horizontalCssClasses' => [
            'label' => 'col-sm-2',
            'offset' => 'col-sm-offset-2',
            'wrapper' => 'col-sm-4',
        ],
    ],
]); ?>
    <div class="row">
        <div class="col-md-6">
            <?= $form->field($model, 'firstname') ?>
            <?= $form->field($model, 'lastname') ?>
       </div>
        <div class="col-md-6">
            <?= $form->field($model, 'email') ?>
            <?= $form->field($model, 'bla') ?>
       </div>
    </div>
<?php ActiveForm::end() ?>

Answer 2

您可以使用引导网格来构建您喜欢的布局

class Author
  has_many :moderated_posts, -> { moderated }, class_name: 'Post' 
end

class Post
  scope :moderated, -> { where(status: approved_statuses) }
end

如何并排布局yii2表单字段

2 个答案: