yii2.0 Activeform表单部分组件使用方法

  老A   2019-10-29 10:05:57  0  86  
关注 喜欢 鲜花 收藏 评论

ActiveForm 改成ajax提交

ActiveForm 改成Layui的表单风格

ActiveInput / ActiveDropDownList

 

PHP Code复制内容到剪贴板
  1. 文本框:textInput();  
  2. 密码框:passwordInput();  
  3. 单选框:radio(),radioList();  
  4. 复选框:checkbox(),checkboxList();  
  5. 下拉框:dropDownList();  
  6. 隐藏域:hiddenInput();  
  7. 文本域:textarea(['rows'=>3]);  
  8. 文件上传:fileInput();  
  9. 提交按钮:submitButton();  
  10. 重置按钮:resetButtun();   

 

获取当前model的所有属性：

QQ截图20180306104613.jpg

PHP Code复制内容到剪贴板
  1. $model->attributes()  

 

$model->getAttribute("name")  //获取值

 

Html::getInputName($model, 'unzip') // 获取根据active表单生成的name值

$model->getAttributeLabel("password") // 获取指定model下指定字段的label字符串

$model->isAttributeRequired("username")  // 获取是否为必填项

 

use yii\widgets\ActiveForm;
use yii\helpers\Html;

 

PHP Code复制内容到剪贴板
  1. <?php  
  2. $form = ActiveForm::begin(['action' => ['test/getpost'],'method'=>'post',]); ?>  
  3.    
  4. <? echo $form->field($model, 'username')->textInput(['maxlength' => 20]) ?>  
  5.   
  6. <? echo $form->field($model, 'password')->passwordInput(['maxlength' => 20]) ?>  
  7.   
  8. <? echo $form->field($model, 'sex')->radioList(['1'=>'男','0'=>'女']) ?>  
  9.   
  10. <? echo $form->field($model, 'edu')->dropDownList(['1'=>'大学','2'=>'高中','3'=>'初中'], ['prompt'=>'请选择','style'=>'width:120px']) ?>  
  11.   
  12. <? echo $form->field($model, 'file')->fileInput() ?>  
  13.   
  14. <? echo $form->field($model, 'hobby')->checkboxList(['0'=>'篮球','1'=>'足球','2'=>'羽毛球','3'=>'乒乓球']) ?>  
  15.   
  16. <? echo $form->field($model, 'info')->textarea(['rows'=>3]) ?>  
  17.   
  18. <? echo $form->field($model, 'userid')->hiddenInput(['value'=>3]) ?>  
  19.   
  20. <? echo Html::submitButton('提交', ['class'=>'btn btn-primary','name' =>'submit-button']) ?>  
  21.      
  22. <? echo Html::resetButton('重置', ['class'=>'btn btn-primary','name' =>'submit-button']) ?>  
  23.   
  24. <?php ActiveForm::end(); ?>  

 

隐藏label：

PHP Code复制内容到剪贴板
  1. <?= $form->field($model, 'plan_id')->hiddenInput(['value' => $model->plan_id?$model->plan_id:\Yii::$app->request->get("id")])->label(false); ?>  

 

隐藏文本框：

PHP Code复制内容到剪贴板
  1. <?= Html::hiddenInput("input-name", "3") ?>  

 

 

给input替换class名称：

XML/HTML Code复制内容到剪贴板
  1. <?= $form->field($model, 'content',[  
  2.                     'inputOptions' => ['class'=>'comment_content']  
  3.                 ])->textInput()->label(false) ?>  

 

 

select 给默认值 ，并禁用，不允许选择：（默认值 在controller里面给如：$model->type=1）

PHP Code复制内容到剪贴板
  1. <?=  
  2. $form->field($model, 'participate_type')  
  3.     ->radioList(Plan::getPlanParticipateType(),  
  4.         ['unselect'=>null,'itemOptions'=>['disabled' => 'disabled']]  
  5.     )  
  6.     ->label(false)  
  7. ?>  

 

 阻止表单提交/表单提交之前动作

PHP Code复制内容到剪贴板
  1. <?php $form = ActiveForm::begin(['action' => Url::to(['/comment/create']),'fieldConfig' => [  'template' => "{label}{input}"],'options' => ['data-pjax' => true,'id'=>'create_comment','onsubmit' => 'javascript:return false;'] ]); ?>  

 

 

YII2 activeform样式修改

PHP Code复制内容到剪贴板
  1. <?php $form = ActiveForm::begin([  
  2.     'options' => [  
  3.         'class' => '',  
  4.         'data-ajax' => '1',  
  5.         'data-callback' => 'window.location.href=SITE_URL',  
  6.     ],  
  7.     'fieldConfig' => [  
  8.         'template' => "<div class='ui-form-item ui-form-item-show ui-border-b'>{label}{input}</div>{error}",  
  9.     ],  
  10. ]); ?>  
  11.   
  12. <?= $form->field($model, 'email') ?>  
  13. <?= $form->field($model, 'phone') ?>  
  14. <?= $form->field($model, 'password')->passwordInput() ?>  
  15. <?= $form->field($model, 're_password')->passwordInput() ?>  
  16. <div class="ui-btn-wrap">  
  17.     <?= Html::submitButton('注册', ['class' => 'ui-btn-lg ui-btn-primary']) ?>  
  18. </div>  
  19. <?php ActiveForm::end(); ?>  

 

 

PHP Code复制内容到剪贴板
  1. <?php $form = ActiveForm::begin([  
  2. 'options'=>['class' => 'form-horizontal'],  
  3. 'fieldConfig' => [  
  4. 'template' => '{label}<div class="col-sm-4">{input}</div><div class="col-sm-5">{error}</div>',  
  5. 'labelOptions' => ['class' => 'col-sm-2 control-label'],  
  6. ],  
  7. ]); ?>  
  8.   
  9. <!--正常表单-->  
  10.                     <?= $form->field($model, 'username')->textInput(['maxlength' => true]) ?>  
  11.   
  12.                     <?= $form->field($model, 'phone')->textInput(['maxlength' => true]) ?>  
  13.   
  14.                     <?= $form->field($model, 'company_name')->textInput(['maxlength' => true]) ?>  
  15.   
  16.                     <?= $form->field($model, 'need')->textarea(['rows' => 6]) ?>  
  17.   
  18.   
  19.   
  20.     <?= $form->field($model, 'title')->textInput(['maxlength' => 255,'placeholder'=>'请输入专题名称'])->label('专题名称') ?>    
  21.     <?= $form->field($model, 'img_path',[      
  22.             'template' => "{label}\n<div class=\"col-lg-3\">{input}</div>\n<div class=\"col-lg-2\"><label for=\"uploadImg\" class=\"btn btn-default forfocus1\" onclick=\"changeImg(1,'forfocus');\">选择图片<img src=\"\"></label></div>\n{error}",      
  23.             'labelOptions' => ['class' => 'col-lg-2 control-label'],    
  24.         ])->textInput(['id'=>'img_path','maxlength' => 255,'placeholder'=>'专题图片','readonly'=>true])->label('专题名称') ?>    
  25.     <?= $form->field($model, 'showImg',[      
  26.             'template' => "{label}\n<div id=\"showImg\" class='col-lg-10'></div>",      
  27.             'labelOptions' => ['class' => 'col-lg-2 control-label'],    
  28.         ])->label('图片预览') ?>    
  29.     <?= $form->field($model, 'link_to')->textInput(['maxlength' => 255,'placeholder'=>'请输入专题链接'])->label('专题链接') ?>    
  30.     </div>    
  31.             
  32.     <div class="form-group" style="margin-left: 50px;">    
  33.         <?= Html::submitButton($model->isNewRecord ? Yii::t('app', 'Create') : Yii::t('app', 'Update'), ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>    
  34.     </div>    
  35.     <?php ActiveForm::end(); ?>    

 

 

activeForm生成的表单中，每行field都会加一个div：<div class='form-group'>，

想让它不生成的选项：

PHP Code复制内容到剪贴板
  1. <?php $form = ActiveForm::begin([  
  2.         'id' => 'form-signup',  
  3.         'options' => [  
  4.             'class' => 'layui-form',  
  5.         ],  
  6.         'fieldConfig' => [  
  7.             'options' => [  
  8.                 'tag' => false, //不生成上一层的<div class='form-group'>  
  9.             ],  
  10.         ],  
  11.     ]); ?>  

 

如果有错误提示的时候，div会加一个class：has-error ，想让它改一个css名称：

PHP Code复制内容到剪贴板
  1. <?php $form = ActiveForm::begin([  
  2.     'errorCssClass' => 'error'  
  3. ]); ?>  

 

替换掉错误提示的div的样式，替换掉help-block：

PHP Code复制内容到剪贴板
  1. <?php $form = ActiveForm::begin([  
  2.     'fieldConfig' => [  
  3.         'errorOptions' => [  
  4.             'class' => 'layui-form-mid layui-word-aux', //替换掉help-block  
  5.         ]  
  6.     ],  
  7. ]); ?>  

 

 

搜索，一行展示：

WX20180410-141145@2x.png

PHP Code复制内容到剪贴板
  1. <?php  
  2.         Yii::$container->set(\yii\widgets\ActiveField::className(), ['template' => "{label}\n{input}"]);  
  3.         $form = ActiveForm::begin([  
  4.             'action' => ['index'],  
  5.             'method' => 'get',  
  6.             'options' => ['class' => 'form-inline'],  
  7.         ]); ?>  

 

 

 

加自定义模板:

QQ截图20170814113758.jpg

PHP Code复制内容到剪贴板
  1. <?=  
  2. $form->field($model, 'participate_type')  
  3.     ->radioList(  
  4.         Plan::getPlanParticipateType(),  
  5.         [  
  6.             'unselect'=>null,  
  7.             'item' => function ($index, $label, $name, $checked, $value) {  
  8.                 $c = $checked ? "checked" : "";  
  9.                 $template = '<input type="radio" ' . $label . ' name="' . $name . '" value="' . $value . '" title="' . $label . '" ' . $c . ' disabled>';  
  10.                 return $template;  
  11.             }  
  12.         ]  
  13.     )  
  14.     ->label(false)  
  15. ?>  

 

 

 

QQ截图20170619161200.jpg

PHP Code复制内容到剪贴板
  1. <?=  
  2. $form->field($model, 'participate_type')  
  3.     ->radioList(  
  4.         Plan::getPlanParticipateType(),  
  5.         [  
  6.             'item' => function ($index, $label, $name, $checked, $value) {  
  7.                 $c = $checked ? "checked" : "";  
  8.                 $template = '<input type="radio" ' . $label . ' name="' . $name . '" value="' . $value . '" title="' . $label . '" ' . $c . '>';  
  9.                 return $template;  
  10.             }  
  11.         ]  
  12.     )  
  13. ?>  

 

 

PHP Code复制内容到剪贴板
  1. <?php  
  2. $labelOptions = [  
  3.     'class' => 'control-label'  
  4. ];  
  5. $inputOptions = [  
  6.     'class' => 'form-control'  
  7. ];  
  8. ?>  
  9.   
  10. <div class="form-group">  
  11.                         <?= Html::activeLabel($model, 'meta_title', $labelOptions)?>  
  12.                         <?= Html::activeTextInput($model, 'meta_title', $inputOptions)?>  
  13.                     </div>  
  14.                     <div class="form-group">  
  15.                         <?= Html::activeLabel($model, 'meta_keyword', $labelOptions)?>  
  16.                         <?= Html::activeTextInput($model, 'meta_keyword', $inputOptions)?>  
  17.                     </div>  
  18.                     <div class="form-group">  
  19.                         <?= Html::activeLabel($model, 'meta_description', $labelOptions)?>  
  20.                         <?= Html::activeTextarea($model, 'meta_description', $inputOptions)?>  
  21.                     </div>  

 

PHP Code复制内容到剪贴板
  1. <div class="box box-primary">  
  2.     <div class="box-body">  
  3.         <?php $form = ActiveForm::begin([  
  4.             'action' => ['index'],  
  5.             'method' => 'get',  
  6.         ]); ?>  
  7.         <div class="row">  
  8.             <div class="col-md-3">  
  9.                 <?= Html::activeDropDownList($model, 'user_name', User::getDropDownListUsers(), ['class' => 'form-control','placeholder' => '请输入标题名称','prompt'=>'请选择']) ?>  
  10.             </div>  
  11.   
  12.             <div class="col-md-3">  
  13.                 <?= Html::activeDropDownList($model, 'published', ['0' => '未发布','1' => '已发布'], ['class' => 'form-control','placeholder' => '请输入标题名称','prompt'=>'请选择'])?>  
  14.             </div>  
  15.             <div class="col-md-3"><?= Html::activeTextInput($model, 'title', ['class' => 'form-control','placeholder' => '请输入标题名称'])?></div>  
  16.             <div class="col-md-3"></div>  
  17.         </div>  
  18.         <div class="form-group text-center content-header">  
  19.             <?= Html::submitButton('Search', ['class' => 'btn btn-primary btn-flat']) ?>  
  20.             <?= Html::resetButton('Reset', ['class' => 'btn btn-default btn-flat']) ?>  
  21.         </div>  
  22.         <?php ActiveForm::end(); ?>  
  23.   
  24.     </div>  
  25. </div>  

 

 1.jpg

PHP Code复制内容到剪贴板
  1. <div class="layui-form-item required">  
  2.     <label class="layui-form-label control-label">房屋楼层</label>  
  3.     <div class="layui-input-block">  
  4.   
  5.         <div class="layui-inline">  
  6.   
  7.             <label class="layui-form-label" style="width: 30px; padding:9px 10px;">第</label>  
  8.             <div class="layui-input-inline" style="width: 60px">  
  9.                 <?= Html::activeTextInput($moduleModel, 'house_floor', [  
  10.                     'class' => 'layui-input',  
  11.                     'lay-verify' => 'required',  
  12.                     'autocomplete' => 'off'  
  13.                 ]) ?>  
  14.             </div>  
  15.             <label class="layui-form-label" style="width: 20px; padding:9px 0px;">层</label>  
  16.         </div>  
  17.   
  18.         <div class="layui-inline">  
  19.   
  20.             <label class="layui-form-label" style="width: 30px; padding:9px 10px;">共</label>  
  21.             <div class="layui-input-inline" style="width: 60px">  
  22.                 <?= Html::activeTextInput($moduleModel, 'house_zonglouceng', [  
  23.                     'class' => 'layui-input',  
  24.                     'size' => 5  
  25.                 ]) ?>  
  26.             </div>  
  27.             <label class="layui-form-label" style="width: 20px; padding:9px 0px;">层</label>  
  28.         </div>  
  29.   
  30.     </div>  
  31. </div>  

 

 2.jpg

PHP Code复制内容到剪贴板
  1.                 <div class="layui-form-item required">  
  2.                     <label class="layui-form-label control-label">房屋户型</label>  
  3.                     <div class="layui-input-block">  
  4.   
  5.                         <div class="layui-inline">  
  6.                             <div class="layui-input-inline">  
  7. <!--                                --><?//= Html::activeTextInput($moduleModel, 'house_shi', [  
  8. //                                    'class' => 'layui-input',  
  9. //                                    'required' => '',  
  10. //                                    'lay-verify' => 'required|number',  
  11. //                                    'autocomplete' => 'off'  
  12. //                                ]) ?>  
  13.   
  14.                                 <?= Html::activeDropDownList($moduleModel, 'house_shi', $moduleModel->getHouseRoom(), [  
  15.                                     'class' => 'layui-input',  
  16.                                 ]) ?>  
  17.                             </div>  
  18.                         </div>  
  19.   
  20.                         <div class="layui-inline">  
  21.                             <div class="layui-input-inline" style="width: 60px">  
  22.                                 <?= Html::activeTextInput($moduleModel, 'house_ting', [  
  23.                                     'class' => 'layui-input',  
  24.                                     'required' => '',  
  25.                                     'lay-verify' => 'required|number',  
  26.                                     'autocomplete' => 'off'  
  27.                                 ]) ?>  
  28.                             </div>  
  29.                             <label class="layui-form-label" style="width: 10px; padding:9px 0px;">厅</label>  
  30.                         </div>  
  31.   
  32.                         <div class="layui-inline">  
  33.                             <div class="layui-input-inline" style="width: 60px">  
  34.                                 <?= Html::activeTextInput($moduleModel, 'house_wei', [  
  35.                                     'class' => 'layui-input',  
  36.                                     'required' => '',  
  37.                                     'lay-verify' => 'required|number',  
  38.                                     'autocomplete' => 'off'  
  39.                                 ]) ?>  
  40.                             </div>  
  41.                             <label class="layui-form-label" style="width: 10px; padding:9px 0px;">卫</label>  
  42.                         </div>  
  43.   
  44.                         <div class="layui-inline">  
  45.   
  46.                             <label class="layui-form-label" style="width: 80px; padding:9px 10px;">共</label>  
  47.                             <div class="layui-input-inline" style="width: 60px">  
  48.                                 <?= Html::activeTextInput($moduleModel, 'house_area', [  
  49.                                     'class' => 'layui-input',  
  50.                                     'required' => '',  
  51.                                     'lay-verify' => 'required|isFloat',  
  52.                                     'autocomplete' => 'off'  
  53.                                 ]) ?>  
  54.                             </div>  
  55.                             <label class="layui-form-label" style="width: 60px; padding:9px 0px;">㎡面积</label>  
  56.                         </div>  
  57.   
  58.                     </div>  
  59.                 </div>  

 

3.jpg

PHP Code复制内容到剪贴板
  1. <div class="layui-form-item required">  
  2.     <label class="layui-form-label control-label">房屋参数</label>  
  3.     <div class="layui-input-block">  
  4.   
  5.         <div class="layui-input-inline">  
  6.   
  7.             <?= Html::activeDropDownList($moduleModel, 'house_object_type', $moduleModel->getHouseObjectType(), [  
  8.                 'class' => 'layui-input'  
  9.             ]) ?>  
  10.   
  11.         </div>  
  12.   
  13.         <div class="layui-input-inline">  
  14.             <?= Html::activeDropDownList($moduleModel, 'house_fit_type', $moduleModel->getHouseFitType(), [  
  15.                 'class' => 'layui-input'  
  16.             ]) ?>  
  17.         </div>  
  18.   
  19.         <div class="layui-input-inline">  
  20.             <?= Html::activeDropDownList($moduleModel, 'house_toward', $moduleModel->getHouseToward(), [  
  21.                 'class' => 'layui-input'  
  22.             ]) ?>  
  23.         </div>  
  24.   
  25.     </div>  
  26. </div>  
  27.   
  28.   
  29. <?=  
  30. $form->field($moduleModel, 'house_want_type')  
  31.     ->radioList(  
  32.         $moduleModel->getHouseWantType(),  
  33.         [  
  34.             'item' => function ($index, $label, $name, $checked, $value) {  
  35.                 $c = $checked ? "checked" : $index == 0 ? "checked" : "";  
  36.                 $template = '<input type="radio" ' . $label . '" name="' . $name . '" value="' . $index . '" title="' . $label . '" ' . $c . '>';  
  37.                 return $template;  
  38.             }  
  39.         ]  
  40.     )  
  41. ?>  
  42.   
  43. <?=  
  44. $form->field($moduleModel, 'house_pay_way')  
  45.     ->radioList(  
  46.         $moduleModel->getHousePayWay(),  
  47.         [  
  48.             'item' => function ($index, $label, $name, $checked, $value) {  
  49.                 $c = $checked ? "checked" : $index == 0 ? "checked" : ""; 
  50.                 $template = '<input type="radio" ' . $label . '" name="' . $name . '" value="' . $index . '" title="' . $label . '" ' . $c . '>';  
  51.                 return $template;  
  52.             }  
  53.         ]  
  54.     )  
  55. ?>  
  56.   
  57. <?=  
  58. $form->field($moduleModel, 'house_type')  
  59.     ->radioList(  
  60.         $moduleModel->getHouseType(),  
  61.         [  
  62.             'item' => function ($index, $label, $name, $checked, $value) {  
  63.                 $c = $checked ? "checked" : $index == 0 ? "checked" : "";  
  64.                 $template = '<input type="radio" ' . $label . '" name="' . $name . '" value="' . $index . '" title="' . $label . '" ' . $c . '>';  
  65.                 return $template;  
  66.             }  
  67.         ]  
  68.     )  
  69. ?>  
  70.   
  71.   
  72. <?= $form->field($moduleModel, 'house_address')->textInput(['maxlength' => true, 'required' => '', 'lay-verify' => 'required', 'autocomplete' => 'off', 'placeholder' => '可记录几号楼几室、房主信息等（仅内部系统展示）']) ?>  

 

 

添加一个默认值 和写一个form的表单就不再使用Html来拼接div了：

PHP Code复制内容到剪贴板
  1. <?php  
  2. $model->phone = Yii::$app->user->identity->username;  
  3. $model->house_price = $price;  
  4. $model->house_address = $address;  
  5. ?>  
  6.   
  7.                         <?php $form = ActiveForm::begin([  
  8.                             'enableAjaxValidation' => true,  
  9.                             'options' => ['class' => 'form-horizontal form-padding'],  
  10.                             'fieldConfig' => [  
  11.                                 'template' => "{label}\n<div class=\"col-md-8\">{input}</div>\n<div class=\"col-md-8 col-md-offset-3\">{error}</div>",  
  12.                                 'labelOptions' => ['class' => 'col-sm-3 control-label'],  
  13.                             ],  
  14.                         ]); ?>  
  15.                         <?= Html::activeHiddenInput($model, 'apply_id', ['value' => Yii::$app->request->get("id", 0)]) ?>  
  16.                         <?= Html::activeHiddenInput($model, 'user_id', ['value' => Yii::$app->user->id]) ?>  
  17.   
  18.                         <fieldset>  
  19.   
  20.                             <div class="form-group">  
  21.                                 <label for="house" class="col-sm-3 control-label">申请房源</label>  
  22.                                 <div class="col-md-8">  
  23.                                     <?= $area ? $area . " - " : "" ?><?= $district ? $district . " - " : "" ?><?= $title ?>  
  24.                                 </div>  
  25.                             </div>  
  26.   
  27.                             <?= $form->field($model, 'truename') ?>  
  28.                             <?= $form->field($model, 'phone') ?>  
  29.                             <?= $form->field($model, 'house_address') ?>  
  30.                             <?= $form->field($model, 'house_price_type')->dropDownList($model->getHousePriceType()) ?>  
  31.                             <?= $form->field($model, 'house_price') ?>  
  32.   
  33.                             <?= $form->field($model, 'pay_datetime')->textInput(['data-toggle' => 'datepicker']) ?>  
  34.                             <?= $form->field($model, 'employer') ?>  
  35.   
  36.                             <?= $form->field($model, 'mark')->textarea(['rows'=>5]) ?>  
  37.   
  38.                             <div class="form-group">  
  39.                                 <div class="col-md-8 col-md-offset-3">  
  40.                                     <?= Html::submitButton('立即提交', ['class' => 'btn btn-success btn-lg']) ?>  
  41.                                 </div>  
  42.                             </div>  
  43.                         </fieldset>  
  44.                         <?php ActiveForm::end(); ?>  

 

ActiveForm 改成ajax提交

PHP Code复制内容到剪贴板
  1.             <?php $form = ActiveForm::begin([  
  2.                 'action' => ['test/getpost'], //可以忽略  
  3.                 'method' => 'post',  
  4.                 'id' =>'staffForm',  
  5.                 'enableAjaxValidation' => true, //必须设置，表示该表单以ajax提交  
  6.             ]); ?>  
  7.   
  8. <!-- 两种隐藏文本框写法-->  
  9. <?= Html::activeHiddenInput($model, 'id') ?>  
  10. <?= Html::hiddenInput("aid", Yii::$app->request->get("aid")) ?>  
  11.   
  12.             <?php ActiveForm::end(); ?>  
  13.   
  14. <!-- JS注册到底部 -->  
  15. <?php $this->beginBlock('js') ?>  
  16.     <script>  
  17.         $(function () {  
  18.             $(document).on('beforeSubmit', 'form#staffForm', function () {  
  19.                 var form = $(this);  
  20.   
  21.                 var loading = layer.load(2);  
  22.   
  23.                 //返回错误的表单信息  
  24.                 if (form.find('.has-error').length) {  
  25.                     return false;  
  26.                 }  
  27.                 //表单提交  
  28.                 $.ajax({  
  29.                     url: form.attr('action'),  
  30.                     type: 'post',  
  31.                     data: form.serialize(),  
  32.                     success: function (res) {  
  33.                         layer.close(loading);  
  34.                         if(res.errcode){  
  35.                             layer.open({  
  36.                                 title: '错误'  
  37.                                 ,content: res.errmsg  
  38.                             });  
  39.                         }else{  
  40.   
  41.                             layer.msg(res.errmsg, {  
  42.                                 time: 1000 // 2秒关闭（如果不配置，默认是3秒）  
  43.                             }, function(){  
  44.                                 history.go(-1);  
  45.                             });  
  46.   
  47.                         }  
  48.                     },  
  49.                     error: function () {  
  50.                         layer.open({  
  51.                             title: '错误'  
  52.                             ,content: '系统错误，请联系管理员'  
  53.                         });  
  54.                         return false;  
  55.                     }  
  56.                 });  
  57.                 return false;  
  58.             });  
  59.         });  
  60.     </script>  
  61. <?php $this->endBlock() ?>  

 

ActiveForm 改成Layui的表单风格

WX20181217-210901@2x.png

PHP Code复制内容到剪贴板
  1. <?php $form = ActiveForm::begin([  
  2.     'id' => 'form-signup',  
  3.     'options' => [  
  4.         'class' => 'layui-form',  
  5.     ],  
  6.     'fieldConfig' => [  
  7.         'options' => [  
  8.             'class' => 'layui-form-item',  
  9.         ],  
  10.         'template' => '{label}<div class="layui-input-inline">{input}</div>{error}',  
  11.         'labelOptions' => ['class' => 'layui-form-label control-label'],  
  12.         'errorOptions' => [  
  13.             'class' => 'layui-form-mid layui-word-aux', //替换掉错误提示的help-block  
  14.         ],  
  15.         'inputOptions' => [  
  16.             'class' => 'layui-input',   //替换掉input表单的form-control  
  17.         ]  
  18.     ],  
  19. ]); ?>  
  20. <?= $form->field($model, 'username') ?>  
  21. <?= $form->field($model, 'password')->passwordInput() ?>  
  22. <?= $form->field($model, 'retypePassword')->passwordInput() ?>  
  23.   
  24. <?= $form->field($model, 'email') ?>  
  25. <?= $form->field($model, 'group_id')->dropDownList(\common\modules\user\models\Group::getGroupList()) ?>  
  26. <?= $form->field($model, 'user_fen') ?>  
  27. <?= $form->field($model, 'money') ?>  
  28. <?= $form->field($model, 'user_date') ?>  
  29. <?= $form->field($model, 'z_group_id')->dropDownList(\common\modules\user\models\Group::getGroupList())->label("到期后转向") ?>  
  30. <?= $form->field($model, 'checked')->dropDownList($model->getCheck())->label("状态") ?>  
  31.   
  32.   
  33. <div class="layui-form-item">  
  34.     <label class="layui-form-label control-label"></label>  
  35.     <div class="layui-input-inline">  
  36.         <?= Html::submitButton("新增", ['class' => 'layui-btn', 'name' => 'signup-button']) ?>  
  37.     </div>  
  38. </div>  
  39.   
  40. <?php ActiveForm::end(); ?>  

 

 css，js需要添加：

XML/HTML Code复制内容到剪贴板
  1. <style>  
  2.     .has-error .layui-form-mid.layui-word-aux {  
  3.         color: #a94442 !important;  
  4.     }  
  5.   
  6.     .layui-form-label.control-label {  
  7.         width: 200px;  
  8.     }  
  9. </style>  
  10.   
  11. <?php $this->beginBlock('js') ?>  
  12.     <script>  
  13.         layui.use(['form'], function () {  
  14.             var form = layui.form;  
  15.         });  
  16.     </script>  
  17. <?php $this->endBlock() ?>  

 

activeInput / activeDropDownList

 

PHP Code复制内容到剪贴板
  1. <?= Html::activeInput('text', $model, 'plan_time', ['class' => 'form-control', 'autocomplete' => 'off','value'=>date("Y-m-d") ]) ?>  

 

PHP Code复制内容到剪贴板
  1. <?= Html::activeInput('text', $model, 'plan_time', ['class' => 'form-control', 'id' => 'layui-input-date0', 'value' => $model->plan_time ? date("Y-m-d", $model->plan_time) : date("Y-m-d")]) ?>  

 

 

PHP Code复制内容到剪贴板
  1. <?= Html::activeHiddenInput($model, 'plan_time', ['value'=>date("Y-m-d")]) ?>  

 

PHP Code复制内容到剪贴板
  1. Html::dropDownList('user_id',$user_id,\backend\modules\user\models\User::getDropDownListAllUser(), ['lay-search' => '']);  
  2.   
  3.   
  4. Html::activeDropDownList($model, 'apply_user_id', \backend\modules\user\models\User::getDropDownListByProjectId(), ['prompt' => '不限', 'lay-search' => '']);   

 

 

PHP Code复制内容到剪贴板
  1. <?= Html::activeTextarea($model, 'reason', ['class' => 'form-control']) ?>  

 

WX20190226-151911@2x.png 

PHP Code复制内容到剪贴板
  1. <?= Html::activeRadioList($model, 'pay_type', [0 => "合同", 1 => "非合同"], [  
  2. //                                'unselect' => null,  
  3.                                 'item' => function ($index, $label, $name, $checked, $value) {  
  4.                                     $c = $checked ? "checked" : "";  
  5.                                     $template = '<input type="radio" ' . $label . ' name="' . $name . '" value="' . $value . '" title="' . $label . '" ' . $c . '>';  
  6.                                     return $template;  
  7.                                 }  
  8.                             ]) ?>  

 

 

WX20190227-220225@2x.png

PHP Code复制内容到剪贴板
  1. <?= $form->field($model, 'project_id')->checkboxList(\backend\models\Project::getAllDropDownList(), [  
  2.         'item' => function ($index, $label, $name, $checked, $value) {  
  3.             $c = $checked ? "checked" : "";  
  4.             $template = '<p class="mb10"><input type="checkbox" ' . $label . ' name="' . $name . '" value="' . $value . '" title="' . $label . '" ' . $c . '></p>';  
  5.             return $template;  
  6.         }  
  7.     ]) ?>  

 

 

 

 

本文来自于：http://www.yoyo88.cn/study/yii2/84.html

评论
请先登录后再发布评论
全部评论
热门分类
 莲心   行摄推荐   技术文章   PHP   Git   阿斯蒂芬   桌面   网站首页   户外旅行   文旅之声   Vue   Linux 
相关文章
区块链，需要预备的知识体系...
游宽窄巷子，思宽窄人生...
中央网信办召开全国网络举报工作会议...
属性（Property）一个小文章...
yii2 为什么数组存个数据会报 s...
yii2 为什么数组存个数据会报 s...
yii2 为什么数组存个数据会报 s...
亚太经合组织...
新华社评论员：同乘合作之舟，共创美好...
新华社评论员：同乘合作之舟，共创美好...
新华社评论员：同乘合作之舟，共创美好...
新华社评论员：同乘合作之舟，共创美好...
官方回应来了！“副局长4分钟不接电话...
二维切片...
二维切片...