使用选项卡小部件将 ActiveForm 字段拆分为不同的选项卡 [英] Split ActiveForm fields into different tabs with Tabs widget

问题描述

我正在创建一个表单视图，我想使用官方的选项卡小部件组织具有选项卡结构的表单字段.

是否可以使用包含活动表单字段的 div 元素的 id(或类)来初始化 Tabs 小部件?

解决方案

管理它的一个例子是这样的:

1. 首先，将您的联系表格分成每个标签的一个视图文件.
2. 将 ActiveForm::begin() 和 ActiveForm::end() 放在 Tabs::widget() 周围
3. 使用参数 $model 和 $form 将联系表单页面渲染为内容

示例代码:

views/site/contact.php

title = '联系人';使用 yiiootstrapTabs;使用 yiiootstrapActiveForm;?><?php $form = ActiveForm::begin(['id' => 'contact-form']);?><?= 标签::小部件(['物品' =>[['标签' =>'一'，'内容' =>$this->render('contact_form1', ['model' => $model, 'form' => $form]),'活跃' =>真的],['标签' =>'二'，'内容' =>$this->render('contact_form2', ['model' => $model, 'form' => $form]),],]]);?><?php ActiveForm::end();?>

views/site/contact_form1.php

field($model, 'name') ?><?= $form->field($model, 'email') ?><?= $form->field($model, 'subject') ?>

views/site/contact_form2.php

<?= $form->field($model, 'body')->textArea(['rows' => 6]) ?><?= $form->field($model, 'verifyCode')->widget(Captcha::className(), ['模板' =>'<div class="row"><div class="col-lg-3">{image}</div><div class="col-lg-6">{input}</div></div>',]) ?><div class="form-group"><?= Html::submitButton('Submit', ['class' => 'btn btn-primary', 'name' => 'contact-button']) ?>

希望这有帮助！

I'm creating a form view and I want to organize the form fields with tabs structure, using the official Tabs widget.

Is it possible init the Tabs widget with the id (or class) of the div elements that contains the active form fields?

解决方案

One example of how you can manage it is doing like this:

1. First, divide your contact-form into one view-file for each tab.
2. Place the ActiveForm::begin() and ActiveForm::end() around the Tabs::widget()
3. Render the contact-form pages into content, with parameters $model and $form

Example code:

views/site/contact.php

<?php

/* @var $this yiiwebView */
$this->title = 'Contact';

use yiiootstrapTabs;
use yiiootstrapActiveForm;
?>


<?php $form = ActiveForm::begin(['id' => 'contact-form']); ?>
<?= Tabs::widget([
        'items' => [
            [
                'label' => 'One',
                'content' => $this->render('contact_form1', ['model' => $model, 'form' => $form]),
                'active' => true
            ],
            [
                'label' => 'Two',
                'content' => $this->render('contact_form2', ['model' => $model, 'form' => $form]),
            ],
        ]]);
 ?>
    <?php ActiveForm::end(); ?>

views/site/contact_form1.php

<?= $form->field($model, 'name') ?>
<?= $form->field($model, 'email') ?>
<?= $form->field($model, 'subject') ?>

views/site/contact_form2.php

<?php
use yiihelpersHtml;
use yiicaptchaCaptcha;
?>

<?= $form->field($model, 'body')->textArea(['rows' => 6]) ?>
<?= $form->field($model, 'verifyCode')->widget(Captcha::className(), [
    'template' => '<div class="row"><div class="col-lg-3">{image}</div><div    class="col-lg-6">{input}</div></div>',
]) ?>
<div class="form-group">
<?= Html::submitButton('Submit', ['class' => 'btn btn-primary', 'name' => 'contact-button']) ?>
</div>

Hope this helps!

这篇关于使用选项卡小部件将 ActiveForm 字段拆分为不同的选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！