Yii 1.1: jmultiselect2side

Extension for multiselect2side plugin
23 followers

Extension for multiselect2side plugin (transfer select).

Requirements

  • Yii 1.1 or above

Installation

  • Extract the release file under protected/extensions

Usage

Example 1.-

<?php
                $this->widget('application.extensions.jmultiselect2side.Jmultiselect2side',array(
                    'name'=>'Model[]',
                    'labelsx'=>'Disponible',
                    'labeldx'=>'Seleccionado',
                    'moveOptions'=>false,
                  'list'=>array('id1'=>'name1','id2'=>'name2') ,
             ));
         ?>

Example 2.- Another example using AR data:

// we have groups and user belonging to groups. (relation in Group model called userList ) Updating group with id==1 :
 
$model= Group::model()->findByAttributes(array('id'=>'1') );
// complete user list to be shown at multiselect order by username
$users= User::model()->findAll(
                 array('order' => 'username'));
 
.....
 
$this->render('update',array(
            'model'=>$model,
                        'users'=>$users,
));

At the view we generate the multiselect using $model:

<?php
                $this->widget('application.extensions.jmultiselect2side.Jmultiselect2side',array(
                    'model'=>$model,
                    'attribute'=>'userList', //selected items
                    'labelsx'=>'Disponible',
                    'labeldx'=>'Seleccionado',
                    'moveOptions'=>false,
                    'autoSort'=>'true',
                    'search' =>'Filtro:',
                  'list'=>CHtml::listData(             // available items
                       $users,
                       'id',
                       'username'),
 
             ));
         ?>

Valid options are:

* selectedPosition - position of selected elements - default 'right'
* moveOptions - show move options - default true
* labelTop - label of top buttom - default 'Top'
* labelBottom - label of bottom buttom - default 'Bottom'
* labelUp - label of up buttom - default 'Up'
* labelDown - label of down buttom - default 'Down'
* labelSort - label of sort buttom - default 'Sort'
* maxSelected - number of max selectable options
* labelsx: Left label - default '* Selected *'
* labeldx: Right label - default '* Available *'
* autoSort: Automatic sort of selected options - default true
* search: Filter/Search

Version log

1.4 Parameter search added.

Resources

Demo

Total 19 comments

#17348 report it
SrikanthMaggidi at 2014/05/28 07:54am
Here is the solution to Extract the selected values

Here you find simple solution to extract the selected values from widget

View::

<?php //$codes = City::model()->findAll();?>
<? $cities=array("Fremont"=>"Fremont","Heyward"=>"Heyward","Oalankd"=>"Oalankd","SanJose"=>"SanJose","SantaClara"=>"SantaClara","Sunny Vale"=>"Sunny Vale");?>
<?php  $this->widget('application.extensions.jmultiselect2side.Jmultiselect2side',array(
                                        'model'=>$citymodel,
                                        'attribute'=>'city_name', //selected items
                                        'labelsx'=>'Available',
                                        'labeldx'=>'Selected',
                                        'moveOptions'=>false,
                                        'autoSort'=>'true',
                                        'search' =>'Seach:',
                                        'list'=>$cities,
                                                                 //'list'=>CHtml::listData($codes,'city_name','city_name'), 
// or use any model to get values from database eg: <?php $codes = City::model()->findAll();?>
 
                                        ));     ?>

Controller::

public function actionCities($id)
        {
                $criteria = new CDbCriteria;
                $criteria->condition = 't.region_id=:regionid';
                $criteria->params = array(':regionid'=>$id);
                $exists = RegionCities::model()->exists($criteria);
                if (!$exists)
                        {
                        $citymodel=new RegionCities;
                        $citymodel->region_id=$id;
                        }
                        else
                        {
        $citymodel=RegionCities::model()->findByAttributes(array('region_id'=>$id));    
                        $citymodel->region_id=$id;
                        }
 
                        if(isset($_POST['RegionCities'])&&!isset($_POST['cancel']))
                        {
                                $citymodel->attributes=$_POST['RegionCities'];
                                $citymodel->region_id=$id;
                                if(isset($_POST['RegionCities']['city_name']))
                                {
 if($_POST['RegionCities']['city_name']!=NULL&&$_POST['RegionCities']['city_name']!=0)
  $citymodel->city_name=implode(";",$_POST['RegionCities']['city_name']);
                                }       
                                else    
                                {
                                $citymodel->city_name=NULL;
                                }
                                if($citymodel->save())
                                {
                       Yii::app()->user->setFlash('success', "Update successfully");
                                $this->redirect(array('admin'));
                                }
                        }
                        if (isset($_POST['cancel'])) 
                        {
                                $this->redirect(array('admin'));
                        }
                        if(isset($citymodel->city_name))
                        $citymodel->city_name=explode(';',$citymodel->city_name);
                        $this->render('cities',array('citymodel'=>$citymodel));
        }

Solution here...

Please post comment

Thanks,

Srikanth

#14300 report it
Narender Negi at 2013/08/03 01:50am
issue while fetching data on update action

i used this extension it works fine when i insert data in to database,but for edit action it did not show database values selected in dropdownlist.Please give me some solution

#13276 report it
kiran sharma at 2013/05/20 04:15am
@rparra, Update scenario not worked as you explain

Here i had tried as you explain and also with different scenario, but for updating (selected values ) things not worked as you explain.

$model= Group::model()->findByAttributes(array('id'=>'1') );

This will fetch only first row so we can't show multiple selected items.

when we use findAll or model Conditional query it just gives error..

So, now am not recomond this if update(default selected) functionality is there.. ..

am Just use custom code for this, follow This Link

#9217 report it
jiann at 2012/07/29 10:45pm
Need to populate both select box

Hey guys need some help here. :|

I need to populate both select. but i only see the 'list'. is there anyway that there is a 'list2' option? thanks

#6406 report it
Taufik at 2012/01/08 04:09am
Item Counts

Because some of my people who use my yii projects that use this extension wants to calculate the number of items selected, i add this code: in (ext)/jmultiselect2side/assets/jquery.multiselect2side.js ===>

"<div id='preview'></div>"
// CREATE NEW ELEMENT (AND HIDE IT) AFTER THE HIDDED ORGINAL SELECT
            var htmlToAdd = 
                "<div class='ms2side__div'>" +
                        ((o.selectedPosition != 'right' && o.moveOptions) ? divUpDown : "") +
                    "<div class='ms2side__select'>" +
                        (o.labelsx || leftSearch != false ? ("<div class='ms2side__header'>" + (leftSearch != false ? leftSearch : o.labelsx) + "</div>") : "") +
                        "<select title='" + o.labelsx + "' name='" + nameSx + "' id='" + nameSx + "' size='" + size + "' multiple='multiple' ></select>" +
                    "</div>" +
                    "<div class='ms2side__options'>" +
                        ((o.selectedPosition == 'right')
                        ?
                        ("<p class='AddOne' title='Add Selected'>&rsaquo;</p>" +
                        "<p class='AddAll' title='Add All'>&raquo;</p>" +
                        "<p class='RemoveOne' title='Remove Selected'>&lsaquo;</p>" +
                        "<p class='RemoveAll' title='Remove All'>&laquo;</p>")
                        :
                        ("<p class='AddOne' title='Add Selected'>&lsaquo;</p>" +
                        "<p class='AddAll' title='Add All'>&laquo;</p>" +
                        "<p class='RemoveOne' title='Remove Selected'>&rsaquo;</p>" +
                        "<p class='RemoveAll' title='Remove All'>&raquo;</p>")
                        ) +
                    "</div>" +
                    "<div class='ms2side__select'>" +
                        (o.labeldx || rightSearch != false ? ("<div class='ms2side__header'>" + (rightSearch != false ? rightSearch : o.labeldx) + "</div>") : "") +
                        "<select title='" + o.labeldx + "' name='" + nameDx + "' id='" + nameDx + "' size='" + size + "' multiple='multiple' ></select>" +
                    "</div>" + "<div id='preview'></div>" +
                    ((o.selectedPosition == 'right' && o.moveOptions) ? divUpDown : "") +
                "</div>";

and this too:
===>
$("#preview").text($("#"+ nameDx +" option").length + " items");
            // ON CHANGE REFRESH ALL BUTTON STATUS
            allSel.change(function() {
                // HACK FOR IE6 (SHOW AND HIDE ORIGINAL SELECT)
                if ($.browser.msie && $.browser.version == '6.0')
                    el.show().hide();
                var div = $(this).parent().parent();
                var selectSx = leftSel.children();
                var selectDx = rightSel.children();
                var selectedSx = leftSel.find("option:selected");
                var selectedDx = rightSel.find("option:selected");

                if (selectedSx.size() == 0 ||
                        (o.maxSelected >= 0 && (selectedSx.size() + selectDx.size()) > o.maxSelected))
                    div.find(".AddOne").addClass('ms2side__hide');
                else
                    div.find(".AddOne").removeClass('ms2side__hide');

                // FIRST HIDE ALL
                div.find(".RemoveOne, .MoveUp, .MoveDown, .MoveTop, .MoveBottom, .SelSort").addClass('ms2side__hide');
                if (selectDx.size() > 1)
                    div.find(".SelSort").removeClass('ms2side__hide');
                if (selectedDx.size() > 0) {
                    div.find(".RemoveOne").removeClass('ms2side__hide');
                    // ALL SELECTED - NO MOVE
                    if (selectedDx.size() < selectDx.size()) {  // FOR NOW (JOE) && selectedDx.size() == 1
                        if (selectedDx.val() != selectDx.val()) // FIRST OPTION, NO UP AND TOP BUTTON
                            div.find(".MoveUp, .MoveTop").removeClass('ms2side__hide');
                        if (selectedDx.last().val() != selectDx.last().val())   // LAST OPTION, NO DOWN AND BOTTOM BUTTON
                            div.find(".MoveDown, .MoveBottom").removeClass('ms2side__hide');
                    }
                }

                if (selectSx.size() == 0 ||
                        (o.maxSelected >= 0 && selectSx.size() >= o.maxSelected))
                    div.find(".AddAll").addClass('ms2side__hide');
                else
                    div.find(".AddAll").removeClass('ms2side__hide');

                if (selectDx.size() == 0)
                    div.find(".RemoveAll").addClass('ms2side__hide');
                else
                    div.find(".RemoveAll").removeClass('ms2side__hide');

                $("#preview").text($("#"+ nameDx +" option").length + " items");
            });

I know this is still a mess. I hope this will add to your extension feature... [Sorry For My Language]

#5771 report it
freddo at 2011/11/10 09:30pm
Re: everything goes fine, but one thing not done

can i know the output of userlist?

#5765 report it
rparra at 2011/11/10 02:16pm
Re: everything goes fine, but one thing not done

Hi I think you are missing something You have 2 ways on how to use it Either use 'name' or 'model' + 'attribute' Review example 2. You have Group containing userList attribute. This attribute contains the list of users related with this group. So: $model= Group::model()->findByAttributes(array('id'=>'1') );

At this point $model contains the group id 1 which contains in userList attribute the list of users for group 1.

// complete user list to be shown at multiselect order by username $users= User::model()->findAll( array('order' => 'username'));

$users contains the complete list of User objects.

Then:

$this->widget('application.extensions.jmultiselect2side.Jmultiselect2side',array( 'model'=>$model, 'attribute'=>'userList', //selected items 'labelsx'=>'Disponible', 'labeldx'=>'Seleccionado', 'moveOptions'=>false, 'autoSort'=>'true', 'search' =>'Filtro:', 'list'=>CHtml::listData( // available items $users, 'id', 'username'),

         ));

here you can see. We show selected the items found at the userList array attribute at $model Object (Group with id 1) And from $users, we tell the extension that we want to show att. username but internally using user id (user id is matching with userList coz userList contains user ids)

#5747 report it
freddo at 2011/11/09 03:42am
everything goes fine, but one thing not done

this estension is awesome, and powerfull , this ekstension make me dizzy for two day, how to use this ( extract the value, get selected from database )... last i didnt success is

i need to use findAllbyAttributes, if use findbyattributes there is just single row that exist... here my code

$models= Relatedproductsview::model()->findAllbyAttributes(array('products_id'=>'1') ); 
// complete user list to be shown at multiselect order by username
$users= Products::model()->findAll(
                 array('order' => 'id'));
            $this->widget('application.extensions.jmultiselect2side.Jmultiselect2side',array(
                    'name'=>'relatedproducts[]',   
                'model'=>$models,
                    'attribute'=>'id', //selected items
                    'labelsx'=>'Available',
                    'labeldx'=>'Selected', 
                  'list'=>CHtml::listData(Products::model()->findAll(),'id', 'title') , 
 
             ));

need help for show multiple row selected, asp.... thx, if i use findallbyattributes it show error -> get_class() expects parameter 1 to be object, array given....

#4384 report it
Rodrigo at 2011/07/04 03:52am
Updating selection list through drop down list via AJAX

Hi,

I'm trying to update the selected items list through a drop down list via AJAX request.

After selecting a package, the products are properly showed in the right list.

But, when I submit the form, the array $_POST['Product'], that should contain the id of the selected products, is not even defined.

How can I fix this?

This is the view code:

<?php echo CHtml::dropDownList('packageId', '', CHtml::listData(Package::model()->findAll(), 'id', 'desc'), array(
    'empty'=>'-- SELECT --',
    'ajax' => array(
        'type'=>'POST',
        'url'=>CController::createUrl('productPackage/dynamicProd'),
        'update'=>'#seleccion0, #Productms2side__dx',
        'data'=>array('packageId'=>'js:this.value'),
    )));
$this->widget('application.extensions.jmultiselect2side.Jmultiselect2side',array(
    'name'=>'Product[]',
    'labelsx'=>'Products',
    'labeldx'=>'Selected',
    'moveOptions'=>false,
    //'autoSort'=>'true',
    'search' =>'Filter:',
    'list' => CHtml::listData(Product::model()->findAll(), 'id', 'name'),
)); ?>
#4070 report it
rparra at 2011/06/03 03:45am
re:Selected items

Have a look on example 2. This is exactly how you should set the selected items. The key here is that the 'attribute' value 'userList' must be an item list containing the same data as defined in the completed list to be shown:

'list'=>CHtml::listData( // available items $users, 'id', 'username'),

So, userList will contain a $user subset items 'id' attribute.

#4037 report it
micz at 2011/05/31 07:27am
Selected items

Who can I add selected items from database?

I know that i needs selected attribute in options but i do not know how to set it.

#3153 report it
Pravin at 2011/03/22 04:12am
Filter/Search capability

The extension is great..! Would be awesome if you can have a filter/search capability..!

#3043 report it
micz at 2011/03/09 05:46pm
Awesome

This extension is awesome. I've planed to do something similar, but without sorting and ordering. Grate job!

#3015 report it
rparra at 2011/03/08 04:00am
Version 1.3 available

Version 1.3 includes (thanks to Dana)

  • Multiple widget use at the same view.
  • Managing model and attribute.
#2999 report it
briiC.lv at 2011/03/07 05:48am
bug on displaying two wdgets on one page

Hi! thanks for plugin, only i got bug if i use widget twice on the same page. One list for array1 and second for array2. When i get 5 listboxes (but shoukd hae 4. Its maybe because there is javascript that assigned only for one listbox with id #seleccion

#2917 report it
Dana at 2011/02/25 08:45am
Collecting selected data into a model

If you wish to use this with a model and accept an array of values back to an attribute, ensure that you name the input correctly as:

'name'=>get_class($model)."[attributeName][]"

It would be a very good enhancement of the extension to allow for a model and attribute field so that this can be done natively by the extension.

#2904 report it
rparra at 2011/02/24 03:50pm
Version 1.2 changed list parameter

Starting version 1.2 the list parameter receives a simple array. If the array is key=>value type then the selected elements are found through key. If the array is of type array(value1,value2,...) then the selected elements are found through position number. I strongly recommend using the first one (see example 2)

#2899 report it
rparra at 2011/02/23 05:46pm
Extracting selected values

Hi ppravin88 I have updated the extension (version 1.1).It had a bug with a whitespace that made the POST variable not to have the values at server. The values at server are extracted using Model[] variable. (the 'name' property)

Regards

#2893 report it
Pravin at 2011/02/23 02:21am
Extracting the selected values

how to extract the selected values..?

Leave a comment

Please to leave your comment.

Create extension