emultiselect Follow @yiiframework

Multiselect with JQuery UI

Creates a multiselect based on http://www.quasipartikel.at/multiselect/

Requirements ¶

Yii 1.1 or more (Tested on 1.1.7)

Usage ¶

Place emultiselect folder in /protected/widget/ Add to form views as needed:

$this->widget(
      'application.widget.emultiselect.EMultiSelect',
      array('sortable'=>false/true, 'searchable'=>false/true)
);

Add the class multiselect and multiselect to dropdowns that you want to be multiselected.

Eg:

echo $form->dropDownList(
    $model,
    'trainings',
    $trainings,
    array('multiple'=>'multiple',
        'key'=>'trainings', 'class'=>'multiselect')
);

Resources ¶

Support

Total 8 comments

#10802

Rochdi at 2012/11/25 05:33am

Enhencement - Adding all possible options in the EMultiSelect class including width

Here is my proposal - tried it and it works well.

Add below attributes

...
 
    public $doubleClickable=true;
    public $animated='fast';
    public $show='slideDown';
    public $hide='slideUp';
    public $dividerLocation=0.5;
    public $width=450;
    public $height= 200;

then in registerScripts() $params should be declared like below instead of empty array.

$params = array(
            "sortable:".($this->sortable?"true":"false"),
            "searchable:".($this->searchable?"true":"false"),
            "doubleClickable:".($this->doubleClickable?"true":"false"),
            "animated:'".$this->animated."'",
            "show:'".$this->show."'",
            "hide:'".$this->hide."'",
            "dividerLocation:".$this->dividerLocation,
            "width:".($this->width===null?"null":$this->width),
            "height:".($this->height===null?"null":$this->height),           
        );

and need to remove

if ($this->sortable) {
            $params[] = "sortable:true";
        } else {
            $params[] = "sortable:false";
        }
 
        if ($this->searchable) {
            $params[] = "searchable:true";
        } else {
            $params[] = "searchable:false";
        }

Now you can set any attirbute like below:

<?php $this->widget('application.widget.emultiselect.EMultiSelect', array(
                    'sortable'=>true, 
                    'searchable'=>true,
                    'width'=>600,
                    'dividerLocation'=>0.3,
                ));?>

#7336

Loren at 2012/03/14 09:09pm

Width

If doing it in your CSS file, you may need to add !important eg .multiselect { width: 460px !important; height: 200px !important; }

Alternatively, you can edit the CSS file in the assets folder of the widget (/protected/widget/emultiselect/assets).

In any case, make sure you clear your project assests folder (/assets/) so that the cache gets reset and it reloads the widget assets and your theme assets.

#7320

jantom at 2012/03/14 05:26am

re: width

@wiseloren

Thanks. I've tried that but I can't get it to work.

I also tried to set the width option in the javascript file but to no effect.

Is the width hardcoded?

#7318

Loren at 2012/03/13 08:55pm

Width

You can override the style in your style sheet. /* multiselect styles */ .multiselect { width: 460px; height: 200px; }

#7314

jantom at 2012/03/13 12:18pm

How can I set the width?

Is it possible to set the width option?

#6829

klod at 2012/02/08 03:30am

@all

Don't work with CForm. Should extend CInputWidget.

#4028

thaddeusmt at 2011/05/30 02:39pm

Pretty slick

Even worked with my advanced Relation widgets, no problem.

As mentioned in the comments here also, I placed this in my Extension folders, so I had to change my paths as well. I used the shortcut "ext.emultiselect.assets".

#3867

Kamarul at 2011/05/16 01:57am

Nice extension but..

Nice extension but with a few bugs..

When add to form..

$this->widget(
 'application.widget.emultiselect.EMultiSelect',
 array('sortable'=>false/true, 'searchable'=>false/true)
);

Change to..

$this->widget(
        'application.extensions.emultiselect.EMultiSelect',
        array('sortable'=>false/true, 'searchable'=>false/true)
      );

EmultiSelect.php - Line #60

$basePath=Yii::getPathOfAlias('application.widget.emultiselect.assets');

Change to...

$basePath=Yii::getPathOfAlias('application.extensions.emultiselect.assets');

$resources = dirname(__FILE__).DIRECTORY_SEPARATOR.'assets';
$basePath  = Yii::app()->assetManager->publish($resources);

Please login to leave your comment.

emultiselect Follow @yiiframework

Requirements ¶

Usage ¶

Resources ¶

Total 8 comments

Leave a comment

Yii Supporters