Replace Chosen jQuery plugin by custom UI component

app/Template/group/associate.php

@@ -9,7 +9,11 @@
         <?= $this->form->hidden('group_id', $values) ?>
 
         <?= $this->form->label(t('User'), 'user_id') ?>
-        <?= $this->form->select('user_id', $users, $values, $errors, array('required'), 'chosen-select') ?>
+        <?= $this->app->component('select-dropdown-autocomplete', array(
+            'name' => 'user_id',
+            'items' => $users,
+            'defaultValue' => isset($values['user_id']) ? $values['user_id'] : null,
+        )) ?>
 
         <div class="form-actions">
             <button type="submit" class="btn btn-blue"><?= t('Save') ?></button>

app/Template/header/board_selector.php

@@ -1,13 +1,13 @@
-<select id="board-selector"
-        class="chosen-select select-auto-redirect"
-        tabindex="-1"
-        data-search-threshold="0"
-        data-notfound="<?= t('No results match:') ?>"
-        data-placeholder="<?= t('Display another project') ?>"
-        data-redirect-regex="PROJECT_ID"
-        data-redirect-url="<?= $this->url->href('BoardViewController', 'show', array('project_id' => 'PROJECT_ID')) ?>">
-    <option value=""></option>
-    <?php foreach ($board_selector as $board_id => $board_name): ?>
-        <option value="<?= $board_id ?>"><?= $this->text->e($board_name) ?></option>
-    <?php endforeach ?>
-</select>
+<?= $this->app->component('select-dropdown-autocomplete', array(
+    'name' => 'boardId',
+    'placeholder' => t('Display another project'),
+    'items' => $board_selector,
+    'redirect' => array(
+        'regex' => 'PROJECT_ID',
+        'url' => $this->url->to('BoardViewController', 'show', array('project_id' => 'PROJECT_ID')),
+    ),
+    'onFocus' => array(
+        'board.selector.open',
+    )
+)) ?>
+

app/Template/project_user_overview/sidebar.php

@@ -1,14 +1,17 @@
 <div class="sidebar">
-    <?= $this->form->select(
-            'user_id',
-            $users,
-            $filter,
-            array(),
-            array('data-redirect-url="'.$this->url->href('ProjectUserOverviewController', $this->app->getRouterAction(), array('user_id' => 'USER_ID')).'"', 'data-redirect-regex="USER_ID"'),
-            'chosen-select select-auto-redirect'
-        ) ?>
+    <?= $this->app->component('select-dropdown-autocomplete', array(
+        'name' => 'user_id',
+        'items' => $users,
+        'defaultValue' => $filter['user_id'],
+        'sortByKeys' => true,
+        'redirect' => array(
+            'regex' => 'USER_ID',
+            'url' => $this->url->to('ProjectUserOverviewController', $this->app->getRouterAction(), array('user_id' => 'USER_ID')),
+        ),
+    )) ?>
+
+    <br>
 
-    <br><br>
     <ul>
         <li <?= $this->app->checkMenuSelection('ProjectUserOverviewController', 'managers') ?>>
             <?= $this->url->link(t('Project managers'), 'ProjectUserOverviewController', 'managers', $filter) ?>