Question

我有一个在Yii2中设计的Web应用程序。客户希望所有文本框更短/更小。在bootstrap中，除了＆＃34; form-control＆＃34;之外，我还需要添加＆＃34; input-sm＆＃34;上课也是如此。

但是，就Yii2而言，表单控件类在模型中设置。示例：ActiveField模型已

'inputOptions' => [
    'class' => 'form-control',
],

但是，我正在使用各种小部件和扩展，需要一个支持的解决方案来设置类，通过一些编辑，我可以使所有文本框和其他控件看起来更小。我不想在每种形式中提及自定义inputOptions。

一种解决方案可能是扩展我使用的所有模型并在那里设置类（input-sm），但更喜欢CSS或更简单的解决方案。

Answer 1

将您的活动字段类扩展为： -

function bookingWidget() {
        return {
            restrict: 'E',
            scope: {
                boatId: '@'
            },
            templateUrl: "/static/app/trips/trips.bookingwidget.template.html",
            controller: 'BookingWidgetController as bookingCtrl',
            link : function(scope, element, attrs, controller){
               console.log(attrs.boatId);
               scope.boatId = attrs.boatId;
            }
        }
    }

现在使用ActiveForm As： -

<?php


namespace auction\widgets;
use yii\helpers\ArrayHelper;

class ActiveField extends \yii\widgets\ActiveField{

    //Error Options For Active Field Error Tag
    public $errorOptions= ['class' => 'error', 'tag' => 'span'];

    public function init(){

        //Changing Input Options Merge with form-class
        $this->inputOptions = ['placeHolder' => $this->model->getAttributeLabel($this->attribute), 'class' => 'input-sm'];

        parent::init();
    }

    /**
     * @param null $label Setting Label Value to false
     * @param array $options
     */
    public function label($label = null, $options = [])
    {

        $this->parts['{label}'] = '';

    }

}

在Yii2中设置所有输入框的类

1 个答案: