Yii 1.1: asmselectex

A progressive enhancement to select multiple form elements.
3 followers

The asmSelectEx widget is implemented based this jQuery plugin: jQuery asmselect plugin.

This widget is way more useful as a select multiple (the default mode).

Resources

Documentation

Requirements

  • Yii 1.0 or above

Installation

  • Extract the release file under protected/extensions

Notes on updating


Usage

See the following code examples.


with optgroups

$arrOptGroups = array(
            'Group1'=>array('value1'=>'The Option text.','value2'=>'option 2'),
            'Group2'=>array('value3'=>'option 3','value4'=>'option 4')
            );
 
$arrSelected = array('value1', 'value3');
 
try
{
    $this->widget('application.extensions.asmselectex.EAsmSelectEx',
        array(
            'name' => 'asmSelect1',
            'data' => $arrOptGroups,
            'selected' => $arrSelected,
            'htmlOptions' => array('title'=>"Select a Item."),
            'scriptOptions' => array('addItemTarget'=>'bottom',
                                     'animate'=>true,
                                     'highlight'=>true,
                                     'sortable'=>false)
        )
    );
} 
catch (Exception $e) 
{
    echo 'Caught Exception: ' .  $e->getMessage() . "<br />\n";
}

Use the above example to create a select-mutliple with optgroups.


without optgroups

$arrOptions = array('value1'=>'The Option text.','value2'=>'option 2','value3'=>'option 3');
 
try
{
    $this->widget('application.extensions.asmselectex.EAsmSelectEx',
        array(
            'name' => 'asmSelect2',
            'data' => $arrOptions,
            'selected' => array('value1', 'value3'),
            'htmlOptions' => array('title'=>"Select a Item."),
            'scriptOptions' => array('addItemTarget'=>'bottom',
                                     'animate'=>true,
                                     'highlight'=>true,
                                     'sortable'=>false)
        )
    ); 
} 
catch (Exception $e) 
{
    echo 'Caught Exception: ' .  $e->getMessage() . "<br />\n";
}

Use the above example to create a select-mutliple without optgroups.


As an CHtml::activeDropDownList from a CModel

$users = User::model()->findAll(array('select'=>array('id', 'username', 'group')));
 
foreach($users as $user)
    $UserList[$user->group][$user->id]=$user->username;
 
try
{   
    $this->widget('application.extensions.asmselectex.EAsmSelectEx',
        array(
            'model' => User::model(),
            'attribute' => "id",
            'data' => $UserList,
            'htmlOptions' => array('title'=>"Select a User."),
            'scriptOptions' => array('sortable'=>true)
        )
    ); 
} 
catch (Exception $e) 
{
    echo 'Caught Exception: ',  $e->getMessage(), "<br />\n";
}

Use the above example to create a "active" Widget, from a Model, based on CHtml::activeDropDownList,
in this case the $selected property isn´t used anymore, use the $attribute property of
CHtml::activeDropDownList instead.


customizing

$arrOptions = array('value1'=>'1. Item.','value2'=>'2. Item','value3'=>'3. Item');
 
try
{
    $myAsmSelect = $this->createWidget('application.extensions.asmselectex.EAsmSelectEx',
        array(
            'name' => 'asmSelect3',
            'data' => $arrOptions,
            'selected' => array('value1', 'value3'),
            'htmlOptions' => array('title'=>"Select a Item."),
            'scriptOptions' => array('sortable'=>true),
            'cssFile'=>'myCSSFile.css'
        )
    );
 
    $myAsmSelect->htmlOptions = array('title'=>"Select a Item to assign.");
 
    $myAsmSelect->applyScriptOption('removeLabel', 'revoke');
    $myAsmSelect->applyScriptOption('highlightAddedLabel', 'assigned: ');
    $myAsmSelect->applyScriptOption('highlightRemovedLabel', 'revoked: ');
    $myAsmSelect->applyScriptOption('highlight', true);
 
    $myAsmSelect->run(); 
} 
catch (Exception $e) 
{
    echo 'Caught Exception: ' .  $e->getMessage() . "<br />\n";
}

Use the above example to create an instance of EAsmSelectEx.

By setting the cssFile property, you can easily theme the widget´s instances.
Just make a copy of the original asmselect.css and make the
classes fit your needs or use for example:
applyScriptOption('listClass', 'myClassName').
jQuery asmselect: Modifiable CSS Classes


Class Documentation

EAsmSelectEx: Class Documentation


Change Log

February 4, 2009

  • v 1.3
  • updated the scriptfiles shipped with the widget
  • new class design, now derivers from CInputWidget.
  • see documentation!

January 16, 2009

  • v 1.2
  • new class design, see documentation!

January 11, 2009

  • v 1.1
  • added type checks+exceptions for all params,
  • added required check for the name-param,
  • now using registerScript($name,$script,POS_READY) instead of a quick and dirty code

January 10, 2009

  • Initial release.

Total 6 comments

#2471 report it
kylian at 2011/01/06 01:23pm
Sorry for my insatisfaction

Thank you for your work but... - The link to the Class Documentation is broken. - Doing a so great job I would have apreciate it a bit more documented, specially with some more explanation on examples and on how to link the widget with models - I do not nderstand what means "As an CHtml::activeDropDownList from a CModel"? I'm not a pro programmer and it took me a lot of time to understand how this thing works.

#174 report it
SimonB at 2010/08/19 05:17am
Found out why breaks datepicker

asmselectx automatically includes an older version of jQuery UI. Remove it from the inlcudes in the plugin and it works

#175 report it
SimonB at 2010/08/19 05:10am
The plugin itself works great, but breaks YUI Datepickers

The plugin itself works like a charme but two YUI Datepickers which are on the same page do not get initialized anymore. When clicking a date input field, I get the following error:

TypeError: Result of expression '$(input).zIndex' [undefined] is not a function.

#295 report it
JoeCoT at 2010/07/15 04:32pm
Works well, tinysort needs update

Works like a charm, only thing I needed to change was updating tinysort to the latest version, because of this bug

#1641 report it
gsatir at 2009/05/27 03:44pm
A great extension

Thanks for your work. I am using this and it looks great. I am using it as an 'active' widget and I had to make one change to get it to work. I had to drop the .'[]' in the following line.

? CHtml::activeDropDownList($this->model, $this->attribute.'[]', $this->_data, $this->htmlOptions)

It works perfect now.

Greg

#1885 report it
Bethrezen at 2009/01/24 05:30am
Great solution for traditional target

Before I started learning Yii Framework, I never heard of asmselectex jQuery plugin. But when I met it here, I was really suprised how it's easy to code and to use.

It's useful to manage user asignments and to assign operations to roles.

5 stars and great respect to ironic.

Leave a comment

Please to leave your comment.

Create extension
  • Yii Version: 1.1
  • License: New BSD License
  • Developed by: ironic
  • Category: User Interface
  • Votes: +7 / -1
  • Downloaded: 757 times
  • Created on: Jan 10, 2009
  • Last updated: Feb 4, 2009