Yii2 ActiveForm表单自定义样式
实例：
<?php $form = ActiveForm::begin([ 'fieldConfig' => [ 'template' => '<div class="col-lg-3 control-label color666 fontweight">{label}:</div> <div class="col-lg-5" style="padding-left: 15px;padding-right: 15px;">{input}</div> <div class="col-lg-4">{error}</div>', 'inputOptions' => ['class' => 'form-control'], ], 'options' => ['class' => 'form-horizontal t-margin20','id'=>'form1','enctype'=>"multipart/form-data"], ]); //\app\helpers\Util::dump($form); /*打印此处$form ActiveForm::begin([]) 追踪源码，调用父级的widget的begin方法是实例化ActiveForm This method creates an instance of the calling class */ ?> /* 自定义样式 $form->field() 调用该方法 查看源码 注释写的 options配置是 ActiveField These are properties of [[ActiveField]] 查看 ActiveField 的属性 就知道可以修改哪些样式 /** * Generates a form field. * A form field is associated with a model and an attribute. It contains a label, an input and an error message * and use them to interact with end users to collect their inputs for the attribute. * @param Model $model the data model * @param string $attribute the attribute name or expression. See [[Html::getAttributeName()]] for the format * about attribute expression. * @param array $options the additional configurations for the field object. These are properties of [[ActiveField]] * or a subclass, depending on the value of [[fieldClass]]. * @return ActiveField the created ActiveField object * @see fieldConfig */ public function field($model, $attribute, $options = []) { $config = $this->fieldConfig; if ($config instanceof \Closure) { $config = call_user_func($config, $model, $attribute); } if (!isset($config['class'])) { $config['class'] = $this->fieldClass; } return Yii::createObject(ArrayHelper::merge($config, $options, [ 'model' => $model, 'attribute' => $attribute, 'form' => $this, ])); } */ <?=$form->field($model, 'product_name',['labelOptions' => ['class' => 't-r-pd5'],'options'=>['class'=>'']])->textInput()?>
ActiveField 部分代码：
1 <?php 2 /** 3 * @link http://www.yiiframework.com/ 4 * @copyright Copyright (c) 2008 Yii Software LLC 5 * @license http://www.yiiframework.com/license/ 6 */ 7 8 namespace yii\widgets; 9 10 use Yii; 11 use yii\base\Component; 12 use yii\base\ErrorHandler; 13 use yii\helpers\ArrayHelper; 14 use yii\helpers\Html; 15 use yii\base\Model; 16 use yii\web\JsExpression; 17 18 /** 19 * ActiveField represents a form input field within an [[ActiveForm]]. 20 * 21 * @author Qiang Xue <qiang.xue@gmail.com> 22 * @since 2.0 23 */ 24 class ActiveField extends Component 25 { 26 /** 27 * @var ActiveForm the form that this field is associated with. 28 */ 29 public $form; 30 /** 31 * @var Model the data model that this field is associated with 32 */ 33 public $model; 34 /** 35 * @var string the model attribute that this field is associated with 36 */ 37 public $attribute; 38 /** 39 * @var array the HTML attributes (name-value pairs) for the field container tag. 40 * The values will be HTML-encoded using [[Html::encode()]]. 41 * If a value is null, the corresponding attribute will not be rendered. 42 * The following special options are recognized: 43 * 44 * - tag: the tag name of the container element. Defaults to "div". 45 * 46 * If you set a custom `id` for the container element, you may need to adjust the [[$selectors]] accordingly. 47 * 48 * @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered. 49 */ 50 public $options = ['class' => 'form-group']; 51 /** 52 * @var string the template that is used to arrange the label, the input field, the error message and the hint text. 53 * The following tokens will be replaced when [[render()]] is called: `{label}`, `{input}`, `{error}` and `{hint}`. 54 */ 55 public $template = "{label}\n{input}\n{hint}\n{error}"; 56 /** 57 * @var array the default options for the input tags. The parameter passed to individual input methods 58 * (e.g. [[textInput()]]) will be merged with this property when rendering the input tag. 59 * 60 * If you set a custom `id` for the input element, you may need to adjust the [[$selectors]] accordingly. 61 * 62 * @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered. 63 */ 64 public $inputOptions = ['class' => 'form-control']; 65 /** 66 * @var array the default options for the error tags. The parameter passed to [[error()]] will be 67 * merged with this property when rendering the error tag. 68 * The following special options are recognized: 69 * 70 * - tag: the tag name of the container element. Defaults to "div". 71 * - encode: whether to encode the error output. Defaults to true. 72 * 73 * If you set a custom `id` for the error element, you may need to adjust the [[$selectors]] accordingly. 74 * 75 * @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered. 76 */ 77 public $errorOptions = ['class' => 'help-block']; 78 /** 79 * @var array the default options for the label tags. The parameter passed to [[label()]] will be 80 * merged with this property when rendering the label tag. 81 * @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered. 82 */ 83 public $labelOptions = ['class' => 'control-label']; 84 /** 85 * @var array the default options for the hint tags. The parameter passed to [[hint()]] will be 86 * merged with this property when rendering the hint tag. 87 * The following special options are recognized: 88 * 89 * - tag: the tag name of the container element. Defaults to "div". 90 * 91 * @see \yii\helpers\Html::renderTagAttributes() for details on how attributes are being rendered. 92 */ 93 public $hintOptions = ['class' => 'hint-block']; 94 /** 95 * @var boolean whether to enable client-side data validation. 96 * If not set, it will take the value of [[ActiveForm::enableClientValidation]]. 97 */ 98 public $enableClientValidation; 99 /** 100 * @var boolean whether to enable AJAX-based data validation. 101 * If not set, it will take the value of [[ActiveForm::enableAjaxValidation]]. 102 */ 103 public $enableAjaxValidation; 104 /** 105 * @var boolean whether to perform validation when the value of the input field is changed. 106 * If not set, it will take the value of [[ActiveForm::validateOnChange]]. 107 */ 108 public $validateOnChange; 109 /** 110 * @var boolean whether to perform validation when the input field loses focus. 111 * If not set, it will take the value of [[ActiveForm::validateOnBlur]]. 112 */ 113 public $validateOnBlur; 114 /** 115 * @var boolean whether to perform validation while the user is typing in the input field. 116 * If not set, it will take the value of [[ActiveForm::validateOnType]]. 117 * @see validationDelay 118 */ 119 public $validateOnType; 120 /** 121 * @var integer number of milliseconds that the validation should be delayed when the user types in the field 122 * and [[validateOnType]] is set true. 123 * If not set, it will take the value of [[ActiveForm::validationDelay]]. 124 */ 125 public $validationDelay; 126 /** 127 * @var array the jQuery selectors for selecting the container, input and error tags. 128 * The array keys should be "container", "input", and/or "error", and the array values 129 * are the corresponding selectors. For example, `['input' => '#my-input']`. 130 * 131 * The container selector is used under the context of the form, while the input and the error 132 * selectors are used under the context of the container. 133 * 134 * You normally do not need to set this property as the default selectors should work well for most cases. 135 */ 136 public $selectors = []; 137 /** 138 * @var array different parts of the field (e.g. input, label). This will be used together with 139 * [[template]] to generate the final field HTML code. The keys are the token names in [[template]], 140 * while the values are the corresponding HTML code. Valid tokens include `{input}`, `{label}` and `{error}`. 141 * Note that you normally don't need to access this property directly as 142 * it is maintained by various methods of this class. 143 */ 144 public $parts = [];
