Yii2 form 表单

表单的创建

  • 在Yii中主要通过 yii\widgets\ActiveForm类来创建表单
  • ActiveForm::begin()不仅创建了一个表单实例,同时也标志着表单的开始
  • 放在 ActiveForm::begin()ActiveForm::end() 之间的所有内容都被包裹在 htmlform 标签中
  • 中间是通过调用 ActiveForm::field() 方法来创建一个 ActiveForm 实例,这个实例会创建表单元素与元素的标签,以及对应的 js 验证
  • ActiveField 有一个对应的模型和属性, input 输入框的 name 属性会自动的根据属性名来创建,同时,还会用属性的验证规则来验证用户输入的数据

e.g.

1
<?= $form->field($model, 'name')->textInput(['autofocus' => true]) ?>

解析后的标签为:

1
<input type="text" id="contactform-name" class="form-control" name="ContactForm[name]" autofocus />

还会自动添加 js 验证,代码如下:

1
2
3
4
5
6
7
8
9
10
11
jQuery('#contactform-name').yiiActiveForm([{
  "id" : "contactform-name",
  "name" : "name",
  "container" : ".field-contactform-name",
  "input" : "#contactform-name",
  "error" : ".help-block.help-block-error",
  "validate" : function(attribute,value,messages,deferred,$form){
  yii.validation.required(value,messages,{
    "messages" : "Name 不能为空",
  });
}])

ActiveField 对象的使用

参考类参考手册 yii\widgets\ActiveField 中的 methods

密码输入框

1
<?= $form->field($model,'password')->passwordInput() ?>

输入框增加了一个提示标签

1
<?= $form->field($model,'username')->textInput()->hint('Please enter your name')->label('Name') ?>

创建一个 html5 的邮箱输入框

1
<?= $form->field($model,'email')->input('email') ?>

自定义输入框的显示标签名

1
<?= $form->field($model,'name')->label('姓名') ?>

额外标签的处理,即与模型对象没有关系的额外 HTML 标签

e.g.submitbutton, p

使用 yii\helpers\Html 帮助类中的方法来添加到表单中

e.g.

纯文本 :

1
<?= '<p class="username">'.$user->name.'</p>' ?>

Html 帮助类

1
<?= Html::tag('p',Html::encode($user->name),['class'=>'username']) ?>

块儿赋值

  • input 中的 name ,实际是以对象名来命名的一个数组,数组的键对应模型的属性 (e.g. name="ContactForm[name]"
  • model 执行 load() 方法,就是对每个属性执行这样一句赋值:$model->name = isset($ContactForm['name']) ? $ContactForm[name] : null;
  • 块赋值就是用这一句代码将用户所有的输入数据填充到模型中去
1
<?= $form->field($model, 'status')->dropDownList($allStatus,['options' => [$needSelected => ['selected' => 'selected']],['prompt'=>'请选择状态']) ?>
  • $allStatus 是一个 [1=>'已发布'] 形式的关联数组
  • $needSelected 为需要默认选中的值,其值满足 $allStatuskey 值中的一个

Yii2中各种文本框的使用

  • 文本框:textInput();
  • 密码框:passwordInput();
  • 单选框:radio(),radioList();
  • 复选框:checkbox(),checkboxList();
  • 下拉框:dropDownList();
  • 隐藏域:hiddenInput();
  • 文本域:textarea([‘rows’=>3]);
  • 文件上传:fileInput();
  • 提交按钮:submitButton();
  • 重置按钮:resetButtun();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?php
$form = ActiveForm::begin(['action' => ['test/getpost'],'method'=>'post',]); ?>

<? echo $form->field($model, 'username')->textInput(['maxlength' => 20]) ?>

<? echo $form->field($model, 'password')->passwordInput(['maxlength' => 20]) ?>

<? echo $form->field($model, 'sex')->radioList(['1'=>'男','0'=>'女']) ?>

<? echo $form->field($model, 'edu')->dropDownList(['1'=>'大学','2'=>'高中','3'=>'初中'], ['prompt'=>'请选择','style'=>'width:120px']) ?>

<? echo $form->field($model, 'file')->fileInput() ?>

<? echo $form->field($model, 'hobby')->checkboxList(['0'=>'篮球','1'=>'足球','2'=>'羽毛球','3'=>'乒乓球']) ?>

<? echo $form->field($model, 'info')->textarea(['rows'=>3]) ?>

<? echo $form->field($model, 'userid')->hiddenInput(['value'=>3]) ?>

<? echo Html::submitButton('提交', ['class'=>'btn btn-primary','name' =>'submit-button']) ?>

<? echo Html::resetButton('重置', ['class'=>'btn btn-primary','name' =>'submit-button']) ?>

<?php ActiveForm::end(); ?>
坚持原创技术分享,您的支持将鼓励我继续创作!
0%