Yii2表单ActiveForm是一个非常方便的表单生成组件。可以把继承\yii\db\ActiveRecord的模型rules转换成js验证规则，这样开发者在写表单时就不需要添加前端验证了。
基本使用这里不做介绍，请看官方文档。
全局配置
全局设置模板关键在fieldConfig属性。
<?php $form = ActiveForm::begin([
// form标签配置
'id'=>'my-form',
'options' => ['class'=>'form-horizontal'],
'action' => '',
// 验证配置
'validateOnBlur'=>false,
'validateOnSubmit'=>true,
'enableAjaxValidation'=>false, // 是否进行异步验证
// 自定义全局模板
'fieldConfig'=>[
'options'=>[
// 设置最外层div的类
'class'=>'form-group',
// 去除最外层div标签
'tag' => false
],
// 模板
'template'=>'{label}\n{input}\n{hint}\n{error}',
// 标签配置
'labelOptions' => ['class' => 'control-label'],
// input输入框配置
'inputOptions'=>['class'=>'form-control'],
// error错误配置
'errorOptions'=>['class'=>''],
// 提示配置
'hintOptions'=>['class'=>''],
]
]);?>
...
...
<?php ActiveForm::end();?>
字段配置
单独的字段配置会覆盖全局的配置。
<?= $form->field($model,'username',[
'options'=>[
// 设置最外层div的类默认是class="form-group"
'class'=>'flex-1 pr-10'，
// 去除最外层div标签
'tag' => false
],
// 设置模板
'template'=>'{label}\n{input}\n{hint}\n{error}'，
// 标签配置，这里会覆盖全局，但会被下面的label覆盖
'labelOptions'=>[],
// input输入框配置，这里会覆盖全局，但会被下面textInput的配置覆盖
'inputOptions'=>[].
])->textInput([
// 设置input的类,默认是class="form-control"，这里会覆盖field配置和全局配置，优先级最高
'class'=>''
])->label('设置label名',[
//labelOptions配置 ，这里的配置会覆盖field配置和全局配置，优先级最高
]); ?>
验证码
验证码显示需要用到yii\captcha\Captcha类型，同事$model中rules需要对应字段为['字段名','captcha']。
<?=$form->field($model, 'captcha')
->widget(\yii\captcha\Captcha::className(), [
// 验证码action
'captchaAction' => '/site/captcha',
// 验证码模板
'template' => '{label}\n{input}\n{image}\n{hint}\n{error}',
// 验证码图片配置
'imageOptions'=>['class'=>'dk-code'],
// 其他配置 同上字段配置
'options'=>[],
// ...
])
?>
单复选
请参看下面的相关文章“Yii2自定义checkboxList和radioList样式”；
异步提交
前端提交表单避免Ajax异步操作，这样可以有很好的用户的体验。
$('#my-form').on('beforeSubmit', function (e) {
// 这里执行异步提交表单
}).on('submit', function (e) {
e.preventDefault();
});