echosen

Anyone know how to add icons next to the list items?

Thanks!

forgive me if it's a stupid question. Since I'm not familiar with jQuery...

But how can i load the data...?

eg. how can i change the code <?php $this->widget('zii.widgets.CListView', array( 'dataProvider'=>$dataProvider, 'itemView'=>'_view', 'id'=>'modellistview', )); ?>

to apply your plugin...?

I added the script position option to the extension.

I will try to check the other issue in the weekend if I have some free time.

It doesn't work for me. Am I wrong? I must delete CClientScript::POS_END from script registrations.

if you register script with same name you can't have single/multiselect/X on same page (see comment #6691)

I love this extension, thanks.

please update chosen to 0.9.7

To display the 'X' to clear the field extension needs to be modified in that way

Extension also needs to be edited in order to obtain select and select-deselect fields on the same page.

Add this to class variables

/**
* @var array native options
*/
public $options = array();

And and then modify run function

public function run()
{
    // Publish extension assets
$assets=Yii::app()->getAssetManager()->publish(Yii::getPathOfAlias('ext.echosen').'/assets');
    $cs=Yii::app()->getClientScript();
    $cs->registerCssFile($assets.'/chosen.css');
 
    // Get extension for JavaScript file
    $ext='.min.js';
    if ($this->debug)
        $ext='.js';
 
    if ($this->useJQuery)
    {
        $options=CJSON::encode($this->options); // <-- HERE
        $cs->registerScriptFile($assets.'/chosen.jquery'.$ext);
        $cs->registerScript("chosen{$this->target}", "$( '{$this->target}' ).chosen({$options});"); // <-- HERE
    }
    else
    {
        $cs->registerScriptFile($assets.'/chosen.proto'.$ext);
    }
}

Hello, First I would like to thank the extension ... I'd like to know how to display the 'X' in the dropdown to clear the field? I saw the http://harvesthq.github.com/chosen/ that you can set the attribute 'allow_single_deselect: true' but can not reproduce in the extension. Thanks

I've discovered that this line in chosen.jquery has something to do with it, if I put a static width in it that's what shows on the page. So it looks like its having issues communicating with the results from yii.

style:"width: "+this.f_width+"px;"}

I could also be totally wrong, the select size is generally determined by the browser, but it appears its 100% and is only stretching as far as the surrounding div which is an incorrect width

as someone else mentioned. its smaller in firefox than it is in chrome. It's due to element.style but can't find out what's setting it. setting a default width does not work for everything. I'm guessing its something to do with yii getting the results from the db and the script knowing what to set the size as. Any insight would be appreciated.

You should dig into Chosen plugin (not extension) source code and check if there is an option for a callback after change or select or something like that. As I just made this extension to replace native select boxes and haven't checked all the posibilities of the plugin, as currently I'm working on other stuff.

If there is no option for a callback, you can try to add an on change event to your select input with the code which will update unit and plugin if needed. Or something like that.

Hi Andrew,

Thanks, your solution to my previous question is working as expected. Now another problem, I have a form where the echosen is used for the product name, I wanted to show the unit of the product next to the quantity. The unit is based on the selected product from the echosen. The unit is updated on every changes of the selection of the echosen. Any solution to this problem?

Thanks a lot.

You have to run (more info on http://harvesthq.github.com/chosen/):

$("#form_field").trigger("liszt:updated");

Thanks for this great extension. i have a little problem, i cannot make it work for dynamic dropdownlist. Regards.

Hi Daniel,

.live won't work as it adds events to elements. What you need to do is add

$( 'select' ).chosen();

after you insert a new select with JavaScript.

Sorry can't explain it in more details, it's just that damn WYMeditor extension sucked out all life from me today, hard to think, you will just have to figure the rest by yourself ;)

Andrew

Hi,

I followed zacarria way to add the detail (http://www.yiiframework.com/wiki/141/javascript-tabular-input/), chosen is attached to the first row, next row generated by javascript would not have chosen shown.

I tried to modify the script to use .live, but not working so far.....

Any help?

Cheers,

Daniel

Thanks for this extension.

I'm having a little trouble with the width of generated selects. They are all rendered smaller than the content.

I've tried to find any css class that should be messing it up but found nothing. In firebug it shows something like

element.style { width: 63px; }

And it should be at least 100px wide to cover all the content

Any help would be very appreciated!

Regards!

EDIT: for those who face the same thing, a simple css

select{min-width:300px} solved the problem for me

now the generated element is 281px wide

regards!

:)