Здравствуйте.
Есть выпадающий список с содержимым:
Но хотелось бы, для улучшения юзабилити, давать возможность не только выбрать содержимое из листа, а иметь возможность самому указать ID.
Т.е. нужна трансформация: select > text-input и чтобы была возможность поменять это в обратном порядке.
Сама структура выпадающего списка:
<div class="form-group field-groupservice-category_id has-success">
<label class="control-label" for="groupservice-category_id">Категория ID</label>
<select id="groupservice-category_id" class="form-control" name="GroupService[category_id]" aria-invalid="false">
<option value="1">Fruit</option>
<option value="2">Vegetables</option>
<option value="4">Roger Federer</option>
</select>
<div class="help-block"></div>
</div>
Пока из идей держать копию text-input'а, копию select'a где-то. Обернуть блок с этим input'ом оберткой, и рядом разместить ссылку "Сменить тип поля". По onclick будет вызываться функция, которая в обертке заменять select<->text-input и саму ссылку на "Сменить тип поля" с этой же функцией, но с другим аргументом. Но кажется, это не самый лучший способ.
P.S. Само приложение на PHP-фрейморвке Yii2.