README

用于处理模型属性多个输入和批量模型表格输入的 Yii2 小工具。

最新版本

该扩展的最新稳定版本是 v2.21.5。请按照升级说明进行从旧版本的升级

安装

安装此扩展的首选方式是通过 composer。

运行以下命令之一

php composer.phar require  unclead/yii2-multiple-input "~2.0"

或者

"unclead/yii2-multiple-input": "~2.0"

将以下内容添加到您的 composer.json 文件的 require 部分。

基本用法

例如，您想在用户资料页面上输入多个用户电子邮件。在这种情况下，您可以使用如下代码中的 yii2-multiple-input 小工具

use unclead\multipleinput\MultipleInput;

...

<?php
    echo $form->field($model, 'emails')->widget(MultipleInput::className(), [
        'max'               => 6,
        'min'               => 2, // should be at least 2 rows
        'allowEmptyList'    => false,
        'enableGuessTitle'  => true,
        'addButtonPosition' => MultipleInput::POS_HEADER, // show add button in the header
    ])
    ->label(false);
?>

更多详情请参阅 单列

高级用法

例如，您想有一个管理用户日程的界面。为了简化，我们将日程存储在 JSON 字符串中。在这种情况下，您可以使用如下代码中的 yii2-multiple-input 小工具

use unclead\multipleinput\MultipleInput;

...

<?= $form->field($model, 'schedule')->widget(MultipleInput::className(), [
    'max' => 4,
    'columns' => [
        [
            'name'  => 'user_id',
            'type'  => 'dropDownList',
            'title' => 'User',
            'defaultValue' => 1,
            'items' => [
                1 => 'User 1',
                2 => 'User 2'
            ]
        ],
        [
            'name'  => 'day',
            'type'  => \kartik\date\DatePicker::className(),
            'title' => 'Day',
            'value' => function($data) {
                return $data['day'];
            },
            'items' => [
                '0' => 'Saturday',
                '1' => 'Monday'
            ],
            'options' => [
                'pluginOptions' => [
                    'format' => 'dd.mm.yyyy',
                    'todayHighlight' => true
                ]
            ]
        ],
        [
            'name'  => 'priority',
            'title' => 'Priority',
            'enableError' => true,
            'options' => [
                'class' => 'input-priority'
            ]
        ]
    ]
 ]);
?>

更多详情请参阅 多列

克隆填充行

use unclead\multipleinput\MultipleInput;

...

<?= $form->field($model, 'products')->widget(MultipleInput::className(), [
    'max' => 10,
    'cloneButton' => true,
    'columns' => [
        [
            'name'  => 'product_id',
            'type'  => 'dropDownList',
            'title' => 'Special Products',
            'defaultValue' => 1,
            'items' => [
                1 => 'id: 1, price: $19.99, title: product1',
                2 => 'id: 2, price: $29.99, title: product2',
                3 => 'id: 3, price: $39.99, title: product3',
                4 => 'id: 4, price: $49.99, title: product4',
                5 => 'id: 5, price: $59.99, title: product5',
            ],
        ],
        [
            'name'  => 'time',
            'type'  => DateTimePicker::className(),
            'title' => 'due date',
            'defaultValue' => date('d-m-Y h:i')
        ],
        [
            'name'  => 'count',
            'title' => 'Count',
            'defaultValue' => 1,
            'enableError' => true,
            'options' => [
                'type' => 'number',
                'class' => 'input-priority',
            ]
        ]
    ]
])->label(false);

使用其他图标库

多个输入和小表格输入小工具现在支持 FontAwesome 以及您选择的任何其他图标库。

要利用这一点，请按照以下步骤操作

1. 将您首选的图标库包含到您的项目中。如果您想使用 fontAwesome，可以使用包含的 FontAwesomeAsset，它将集成来自他们的 CDN 的免费 fa；
2. 如果您首选的图标库不在小工具的 iconMap 数组中，添加一个映射，如下所示；

public $iconMap = [
    'glyphicons' => [
        'drag-handle' => 'glyphicon glyphicon-menu-hamburger',
        'remove' => 'glyphicon glyphicon-remove',
        'add' => 'glyphicon glyphicon-plus',
        'clone' => 'glyphicon glyphicon-duplicate',
    ],
    'fa' => [
        'drag-handle' => 'fa fa-bars',
        'remove' => 'fa fa-times',
        'add' => 'fa fa-plus',
        'clone' => 'fa fa-files-o',
    ],
    'my-amazing-icons' => [
        'drag-handle' => 'my my-bars',
        'remove' => 'my my-times',
        'add' => 'my my-plus',
        'clone' => 'my my-files',
    ]
];

1. 设置首选图标源

    public $iconSource = 'my-amazing-icons';

如果您不做上述任何一项，将保留默认行为，这假设您正在使用 glyphicons。

文档

您可以在 wiki 中找到完整的文档。

许可证

yii2-multiple-input 在 BSD 3-Clause 许可证下发布。有关详细信息，请参阅捆绑的 LICENSE.md。