I have the code for the CJuiSelectable and is shown correctly the problem is how to get the selected value, on the CJuiSelectable htmlOptions->name or on a hidden field of the form.
Any help?
I have the code for the CJuiSelectable and is shown correctly the problem is how to get the selected value, on the CJuiSelectable htmlOptions->name or on a hidden field of the form.
Any help?
Looks the CJuiSelectable is not used too much as there are only 3 posts about this widget.
Does it work?
Hi
This widget is faithful to the configuration of the respective jQueryUI. Try this:
$this->widget('zii.widgets.jui.CJuiSelectable', array(
'itemTemplate'=>'<li class="ui-widget-content" id="{id}">{content}</li>',
'items'=>array(
'id1'=>'Item 1',
'id2'=>'Item 2',
'id3'=>'Item 3',
),
// additional javascript options for the selectable plugin
'options'=>array(
'selected'=>'js:function(event, ui) { alert( $(ui.selected).attr("id") ); }'
),
'htmlOptions'=>array(
'name'=>'the-name-for-your-widget',
'id'=>'the-id-for-your-widget',
),
));
You should add some CSS code (customize it to fit your needs) to your view or main CSS file:
<style>
.feedback { font-size: 1.4em; }
.ui-selecting { background: #FECA40; }
.ui-selectable .ui-selected { background: #F39814; color: white; }
.ui-selectable { list-style-type: none; margin: 0; padding: 0; width: 200px; }
.ui-selectable li { margin: 3px; padding: 4px; font-size: 12px; height: 14px; }
</style>
This example popup an alert when an item is selected. You can replace that js function with your favourite ajax code.
Aged post with some useful information is here