skeeks/yii2-widget-chosen

为 Yii2 的 Bootstrap Chosen 小部件

安装次数: 23,533

依赖项: 3

建议者: 0

安全: 0

星标: 0

关注者: 2

分支: 0

语言:HTML

类型:yii2-extension

1.2.2.3 2020-10-02 12:45 UTC

This package is auto-updated.

Last update: 2024-09-05 15:03:31 UTC


README

致谢

Chosen http://harvesthq.github.io/chosen/

Chosen Bootstrap 视觉效果 https://github.com/dbtek/chosen-bootstrap (包含我的样式修正)

安装

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

运行以下命令之一:

php composer.phar require "skeeks/yii2-widget-chosen" "*"

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

"skeeks/yii2-widget-chosen" : "*"

用法

使用模型

<?php
use skeeks\widget\chosen\Chosen;
?>

<?= Chosen::widget([
    'model' => $model,
    'attribute' => 'selectable_attr',
    'items' => [1 => 'First item', 2 => 'Second item', 3 => 'Third item'],
    'multiple' => true,
]);?>

<?= $form->field($model, 'selectable_attr')->widget(
    Chosen::className(), [
        'items' => [1 => 'First item', 2 => 'Second item', 3 => 'Third item'],
        'disableSearch' => 5, // Search input will be disabled while there are fewer than 5 items
        'clientOptions' => [
            'search_contains' => true,
            'single_backstroke_delete' => false,
        ],
]);?>

不使用模型

<?php
use skeeks\widget\chosen\Chosen;
?>
<?= Chosen::widget([
    'name' => 'ChosenTest',
    'value' => 3,
    'items' => [1 => 'First item', 2 => 'Second item', 3 => 'Third item'],
    'allowDeselect' => false,
    'disableSearch' => true, // Search input will be disabled
    'clientOptions' => [
        'search_contains' => true,
        'max_selected_options' => 2,
    ],
]);?>

要覆盖默认的占位符字符串,您可以将 Select an option (单选) 和 Select some options (多选) 的翻译消息添加到您的应用消息文件中。默认情况下,小部件将使用 'app' 类别来翻译这些字符串,但您可以通过在 widget 配置中更改 translateCategory 选项来设置自己的类别。例如,您可以在应用配置文件中写入以下内容:

<?php
\Yii::$container->set('skeeks\widget\chosen\Chosen', [
    'translateCategory' => 'my-app',
]);

您也可以在调用小部件时覆盖占位符文本(这对于宽度较小的选择器可能很有用)

<?php
use skeeks\widget\chosen\Chosen;
?>
<?= Chosen::widget([
    'name' => 'ChosenTest',
    'value' => 3,
    'items' => [1 => 'First item', 2 => 'Second item', 3 => 'Third item'],

    'placeholder' => 'Select',
]);?>

skeeks!
SkeekS CMS (Yii2) — 快速、简单、有效!
skeeks.com | cms.skeeks.com