Как разместить поля поля yii2 рядом друг с другом

Question

Я хотел бы разместить поля формы в Yii2 бок о бок, в сетке 2x2.

Я использую самозагрузки/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

Вы можете использовать сетку для начальной загрузки построить макет вы предпочитаете

<div class="site-index"> 
    <div class="body-content"> 
     <div class='col-sm-6 col-md-6' id='id'> 
     <?php 
       $form1 = ActiveForm::begin([ 
        'layout' => 'horizontal', 
        'action' => ['index1'], 
        'method' => 'get', 
        'fieldConfig' => [ 
         'horizontalCssClasses' => [ 
          'label' => 'col-sm-2', 
          'offset' => 'col-sm-offset-2', 
          'wrapper' => 'col-sm-4', 
         ], 
        ], 
       ]); 

       ... 
     ?> 

     </div> 
     <div class='col-sm-6 col-md-6' id='id2'> 

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

       ... 
     </div> 
    </div> 
</div>