Paul Apostol's Blog

In the post  Yii form enhancement with jQueryUI I’ve used for dropdowns a widget from FilamentGroup which it was charming but not so capable. Searching the web I found a more capable plugin that fits better my needs, I hope yours too.

The plugin can be found here http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/ and is very well done, with a lot of features and examples. You will need the the article and demos for your dropdown settings. The plugin for filtering is added, too. (there is a little change from my side because the change event was not fired and I couldn’t use cascade plugin, and some changes to filter plugin)

The extension created for Yii works the same as the previous version. I’ve added 3 new parameters in case you don’t want to load js for: “select” for multipleselect widget, “list” for listselect widget, “filter” for filter plugin. If you don’t have such elements in your form you could save some traffic.

1
2
3

$this->widget(
      'application.extensions.JQuiFormEnhancer.JQuiFormEnhancer',
      array('formId'=>'id-form'));

I added in the main widget js (ui.formenhancer.js) default parameters for dropdown and for filtering. If you need to have different parameters you have to add some options for dropdown

1) settings: a string that represents the object to configure “{….}”

2) filter: options for filtering (unfortunately not many, we have to wait for the developer to expose the filtering function) “{….}”

3) size: a standard html attribute that trugger the display of a listbox instead of a dropdown

The widget adds the “multiple” tag automatically to the dropdown if multiple option is not specifically set as false. The filter is added in case you set the “filter” option or in case you add in “settings” option “filtered:true”. The previous version options are gone.

I also changed the jQueryCascade plugin to fit the new changes. For the last parameter (callback) if you set it as ‘multiselect’ it will work with this form enhancement.

For multiple select do not forget to add brackets “[]” at the end of the id of the dropdown widget.
Download Form enhancer
Download Cascade plugin