A specialized jquery based DropDownList component displaying checkboxes as options.
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
assets
README.md
Select3Asset.php
Select3Widget.php
composer.json
example.jpg
license.txt

README.md

Select3 (yii2-select3)

Display a hybrid between a DropDownList and a Multi-selectable checkboxes.

platform: Yii Framework 2.0

author: Cristian Salazar chileshift.cl/freesoftwarefactory

Preview

Preview

Usage

  1. Via composer,
"require": {
    "php": ">=5.4.0",
	"freesoftwarefactory/yii2-select3": "(put version here)"
},
  1. In your View
<?php
use yii\widgets\ActiveForm;
use freesoftwarefactory\select3\Select3Widget;

$options = 
[
    'opt1' => "Chevrolet",
    'opt2' => "Mazda",
    'opt3' => "Audi",
];



?>

<?php $form = ActiveForm::begin( [ 'id'=>'form1', ]); ?>

<div class='row'>
    <div class='col-md-3'>
        <?=$form->field($model, 'someAttributeInYourModel')
            ->widget(Select3Widget::className(), 
                [
                    'prompt' => 'Select Provider',
                    'options' => $options,
                    'allSelectable' => true,
                    'allSelectableLabel' => "(All)",
                    'visibleAtStartup' => false,
                ]) ?>
    </div>
</div>

<?php ActiveForm::end(); ?>

Receving Values from this Control

Values are base64+json encoded, that is, when you submits a form using this control then you will have something similar to:

eyJvcHQxIjp0cnVlLCJvcHQyIjp0cnVlLCJvcHQzIjpmYWxzZX0=

Which is a base64 encoded version of this:

 {"opt1":true,"opt2":true,"opt3":false}

So, you can just call:

$values = json_decode(base64_decode($model->yourAttribute),true);

Or... just call :)

$values =  Select3Widget::getDecodedValueFrom($model, 'yourAttribute');

More functions

  1. load items via javascript by calling:
$.fn.select3load($('#widgetid') , { 123 : some , 456 : thing });
  1. Disable the control by passing:
[
    'disable'=>true,
]
  1. Disable/Check some items at startup by calling
[
    'disabledOptions' => ['somekeydisabled'],

    'autoSelectOptions' => ['somekeySelectedFromTheBeginning'],
]
  1. Javascript events to listen for changes
$this->registerJs("
    $(document).on('select3-changed', [], function(e, options, widget){
        console.log('select3-changed', options, widget);     
    });
");