anggiaj / eselect2
ESelect2 is a widget extension for Yii framework. This extension is a wrapper for Select2 Jquery plugin (https://github.com/ivaynberg/select2).
Installs: 2 311
Dependents: 0
Suggesters: 0
Security: 0
Stars: 0
Watchers: 2
Forks: 14
Language:JavaScript
This package is not auto-updated.
Last update: 2024-11-19 02:36:01 UTC
README
ESelect2 is a widget extension for Yii framework. This extension is a wrapper for Select2 Jquery plugin (https://github.com/ivaynberg/select2).
Requirements
- Yii 1.1 or above (tested on 1.1.10)
Usage
- Extract the downloaded file to your application extensions directory
- Use it at your view
Examples
Basic
$this->widget('ext.select2.ESelect2', array( 'name' => 'selectInput', 'data' => array( 0 => 'Nol', 1 => 'Satu', 2 => 'Dua', ) ));
Working with model
$this->widget('ext.select2.ESelect2', array( 'model' => $model, 'attribute' => 'attrName', 'data' => array( 0 => 'Nol', 1 => 'Satu', 2 => 'Dua', ), ));
Using selector
$tags = array('Satu', 'Dua', 'Tiga'); echo CHtml::textField('test', '', array('id' => 'test')); $this->widget('ext.select2.ESelect2', array( 'selector' => '#test', 'options' => array( 'tags' => $tags, ), ));
Using optgroup
$data = array( 'one' => array( '1' => 'Satu', '2' => 'Dua', '3' => 'Tiga', ), 'two' => array( '4' => 'Sidji', '5' => 'Loro', '6' => 'Telu', ), 'three' => array( '7' => 'Hiji', '8' => 'Dua', '9' => 'Tilu', ), ); $this->widget('ext.select2.ESelect2', array( 'name' => 'testing', 'data' => $data, ));
Multiple data
$data = array( '1' => 'Satu', '2' => 'Dua', '3' => 'Tiga', ); $this->widget('ext.select2.ESelect2', array( 'name' => 'ajebajeb', 'data' => $data, 'htmlOptions' => array( 'multiple' => 'multiple', ), ));
Placeholder
$this->widget('ext.select2.ESelect2', array( 'name' => 'asik2x', 'data' => $data, 'options' => array( 'placeholder' => Yii::t('select2', 'Keren ya?'), 'allowClear' => true, ), ));
Working with remote data
echo CHtml::textField('movieSearch', '', array('class' => 'span5')); $this->widget('ext.select2.ESelect2', array( 'selector' => '#movieSearch', 'options' => array( 'placeholder' => 'Search a movie', 'minimumInputLength' => 1, 'ajax' => array( 'url' => 'http://api.rottentomatoes.com/api/public/v1.0/movies.json', 'dataType' => 'jsonp', 'data' => 'js: function(term,page) { return { q: term, page_limit: 10, apikey: "e5mnmyr86jzb9dhae3ksgd73" // Please create your own key! }; }', 'results' => 'js: function(data,page){ return {results: data.movies}; }', ), 'formatResult' => 'js:function(movie){ var markup = "<table class=\"movie-result\"><tr>"; if (movie.posters !== undefined && movie.posters.thumbnail !== undefined) { markup += "<td class=\"movie-image\"><img src=\"" + movie.posters.thumbnail + "\"/></td>"; } markup += "<td class=\"movie-info\"><div class=\"movie-title\">" + movie.title + "</div>"; if (movie.critics_consensus !== undefined) { markup += "<div class=\"movie-synopsis\">" + movie.critics_consensus + "</div>"; } else if (movie.synopsis !== undefined) { markup += "<div class=\"movie-synopsis\">" + movie.synopsis + "</div>"; } markup += "</td></tr></table>"; return markup; }', 'formatSelection' => 'js: function(movie) { return movie.title; }', ), ));
Resources
- Jquery extension URL:
- https://github.com/ivaynberg/select2
- Demo http://ivaynberg.github.com/select2/
- Yii extension URL:
- http://www.yiiframework.com/extension/select2/
- https://github.com/anggiaj/ESelect2