PHPackages xutl/yii2-type-ahead-widget - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. xutl/yii2-type-ahead-widget ActiveYii2-extension[Utility & Helpers](/categories/utility) xutl/yii2-type-ahead-widget =========================== The bootstrap typeahead widget for the Yii framework 1.0.3(9y ago)0170BSD-3-ClauseJavaScript Since Sep 2Pushed 9y agoCompare [ Source](https://github.com/xutl/yii2-type-ahead-widget)[ Packagist](https://packagist.org/packages/xutl/yii2-type-ahead-widget)[ Docs](https://github.com/2amigos/yii2-type-ahead-widget)[ RSS](/packages/xutl-yii2-type-ahead-widget/feed)WikiDiscussions master Synced 2mo ago READMEChangelog (4)Dependencies (3)Versions (5)Used By (0) Bootstrap TypeAhead Widget for Yii2 =================================== [](#bootstrap-typeahead-widget-for-yii2) [![Latest Version](https://camo.githubusercontent.com/220062ae363e18dc385f90a55301cc29bc396702bd1295ed972e83921cdf3717/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f7461672f32616d69676f732f796969322d747970652d61686561642d7769646765742e7376673f7374796c653d666c61742d737175617265266c6162656c3d72656c65617365)](https://github.com/2amigos/yii2-type-ahead-widget/tags)[![Software License](https://camo.githubusercontent.com/55c0218c8f8009f06ad4ddae837ddd05301481fcf0dff8e0ed9dadda8780713e/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d627269676874677265656e2e7376673f7374796c653d666c61742d737175617265)](LICENSE.md)[![Build Status](https://camo.githubusercontent.com/53d59f70a96883eb00b032cd98ba653841691736556a0c780175f986593f56d9/68747470733a2f2f696d672e736869656c64732e696f2f7472617669732f32616d69676f732f796969322d747970652d61686561642d7769646765742f6d61737465722e7376673f7374796c653d666c61742d737175617265)](https://travis-ci.org/2amigos/yii2-type-ahead-widget)[![Coverage Status](https://camo.githubusercontent.com/56eed58ba766e234f1ffda009cac468e9b6d68bfb6e5019b6ebb9bfe9f8a5867/68747470733a2f2f696d672e736869656c64732e696f2f7363727574696e697a65722f636f7665726167652f672f32616d69676f732f796969322d747970652d61686561642d7769646765742e7376673f7374796c653d666c61742d737175617265)](https://scrutinizer-ci.com/g/2amigos/yii2-type-ahead-widget/code-structure)[![Quality Score](https://camo.githubusercontent.com/6ba5c3c18ccf7768f4b360ffeb731c06713b28c1e75d30d84a41df9630a8ce91/68747470733a2f2f696d672e736869656c64732e696f2f7363727574696e697a65722f672f32616d69676f732f796969322d747970652d61686561642d7769646765742e7376673f7374796c653d666c61742d737175617265)](https://scrutinizer-ci.com/g/2amigos/yii2-type-ahead-widget)[![Total Downloads](https://camo.githubusercontent.com/89958e03ccb5bb34fd417bd0f2d2a143c0c9c1a480932bb28df2511683ce608d/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f32616d69676f732f796969322d747970652d61686561642d7769646765742e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/2amigos/yii2-type-ahead-widget) Renders a [Twitter Typeahead.js Bootstrap plugin](https://github.com/twitter/typeahead.js) widget. [原版](https://github.com/2amigos/yii2-type-ahead-widget) 仅修改了样式表，原版自带的样式表不能用了，另外把typeaheadjs本地化了。 Installation ------------ [](#installation) The preferred way to install this extension is through [composer](http://getcomposer.org/download/). Either run ``` $ composer require xutl/yii2-type-ahead-widget:~1.0 ``` or add ``` "xutl/yii2-type-ahead-widget": "~1.0" ``` to the `require` section of your `composer.json` file. Usage ----- [](#usage) Using a model and a `remote` configuration: ``` use dosamigos\typeahead\Bloodhound; use dosamigos\typeahead\TypeAhead; use yii\helpers\Url; ``` Note the use of the custom `wildcard`. It is required as if we use `typeahead.js` default's wildcard (`%QUERY`), Yii2 will automatically URL encode it thus making the wrong configuration for token replacement. The results need to be JSON encoded as specified on the [plugin documentation](https://github.com/twitter/typeahead.js#datum). The following is an example of a custom `Action` class that you could plug to any `Controller`: ``` namespace frontend\controllers\actions; use yii\base\Action; use yii\helpers\Json; use yii\base\InvalidConfigException; class AutocompleteAction extends Action { public $tableName; public $field; public $clientIdGetParamName = 'query'; public $searchPrefix = ''; public $searchSuffix = '%'; public function init() { if($this->tableName === null) { throw new InvalidConfigException(get_class($this) . '::$tableName must be defined.'); } if($this->field === null) { throw new InvalidConfigException(get_class($this) . '::$field must be defined.'); } parent::init(); } public function run() { $value = $this->searchPrefix . $_GET[$this->clientIdGetParamName] . $this->searchSuffix; $rows = \Yii::$app->db ->createCommand("SELECT {$this->field} AS value FROM {$this->tableName} WHERE {$this->field} LIKE :field ORDER BY {$this->field}") ->bindValues([':field' => $value]) ->queryAll(); echo Json::encode($rows); } } ``` And how to configure it on your `Controller` class: ``` public function actions() { return [ 'autocomplete' => [ 'class' => 'frontend\controllers\actions\AutocompleteAction', 'tableName' => Country::tableName(), 'field' => 'name' ] ]; } ``` Theming ------- [](#theming) [Twitter Typeahead.js Bootstrap plugin](https://github.com/twitter/typeahead.js) does not style the dropdown nor the hint or the input-field. It does it this way in order for you to customize it so it suits your application. We have included a stylesheet with hints to match `form-control` bootstrap classes and other tweaks so you can easily identify the classes and style it. Testing ------- [](#testing) ``` $ ./vendor/bin/phpunit ``` Contributing ------------ [](#contributing) Please see [CONTRIBUTING](CONTRIBUTING.md) for details. Credits ------- [](#credits) - [Antonio Ramirez](https://github.com/tonydspaniard) - [Alexander Kochetov](https://github.com/creocoder) - [All Contributors](https://github.com/2amigos/yii2-selectize-widget/graphs/contributors) License ------- [](#license) The BSD License (BSD). Please see [License File](LICENSE.md) for more information. > [![](https://camo.githubusercontent.com/9fd8f1de41dc23003bb2a54034cb6658dde5be97092e195a62d629d0d7fa7f6c/687474703a2f2f7777772e67726176617461722e636f6d2f6176617461722f35353336333339346437323934356666376564333132353536656330343165302e706e67)](http://www.2amigos.us) > *web development has never been so fun* > [www.2amigos.us](http://www.2amigos.us) ### Health Score 29 — LowBetter than 60% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity10 Limited adoption so far Community6 Small or concentrated contributor base Maturity66 Established project with proven stability Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~0 days Total 4 Last Release 3539d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/87b658aa9d49e0c80cfc609fa2b9dc6d615672b1d895f421f751945a0e394087?d=identicon)[larvacent](/maintainers/larvacent) --- Top Contributors [![xutl](https://avatars.githubusercontent.com/u/20939388?v=4)](https://github.com/xutl "xutl (1 commits)") --- Tags yii2widgetyiitypeaheadyii 22amigos ### Code Quality TestsPHPUnit ### Embed Badge ![Health badge](/badges/xutl-yii2-type-ahead-widget/health.svg) ``` [![Health](https://phpackages.com/badges/xutl-yii2-type-ahead-widget/health.svg)](https://phpackages.com/packages/xutl-yii2-type-ahead-widget) ``` PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)