How to get CJuiSelectable selected value?

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