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.
Extracting the selected values
how to extract the selected values..?
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
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)
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.
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
Version 1.3 available
Version 1.3 includes (thanks to Dana)
Awesome
This extension is awesome. I've planed to do something similar, but without sorting and ordering. Grate job!
Filter/Search capability
The extension is great..! Would be awesome if you can have a filter/search capability..!
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.
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.
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'), )); ?>
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....
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)
Re: everything goes fine, but one thing not done
can i know the output of userlist?
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
===>
~~~
"
~~~
~~~
// 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'>›</p>" + "<p class='AddAll' title='Add All'>»</p>" + "<p class='RemoveOne' title='Remove Selected'>‹</p>" + "<p class='RemoveAll' title='Remove All'>«</p>") : ("<p class='AddOne' title='Add Selected'>‹</p>" + "<p class='AddAll' title='Add All'>«</p>" + "<p class='RemoveOne' title='Remove Selected'>›</p>" + "<p class='RemoveAll' title='Remove All'>»</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]
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
@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
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
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
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.