Выпадающие списки с опцией «other»

Question

Каждый раз, когда я получаю спецификацию, требующую выпадающего списка с опцией «Другое (указать ниже)», я стонаю, потому что это такая боль для реализации.

1. Какое удобство хранения этой информации в базе данных? Лучше ли использовать два поля: один целочисленный внешний ключ для значения в другой таблице (в том числе «Другой») и второе строковое поле для хранения значения «Другое», если оно выбрано? Или просто сохраните выбранный параметр как строку независимо (это также облегчает извлечение значения из базы данных).
2. Интерфейс по умолчанию, вы используете обычный старый <select> и всплываете скрытый <input type="text"/>, если выбрано «Другое» (возможно, через хакерство jQuery) или использовать вид виджетов combox? «Фильтрация» версии this widget является наиболее удобной для пользователя, но реализация выглядит не очень хорошо (2000 строк, и у нее есть ошибки).

---

В качестве примера, скажем, у меня есть таблица под названием vehicles. В нем перечислены все транспортные средства, зарегистрированные на моем сайте. Он содержит такие вещи, как год, марка, модель, пробег.

Скажем, у меня есть еще одна таблица, которая содержит все делает для пользователей, чтобы выбрать из: Honda, Toyota, BMW и т.д.

Но мой «делает» таблица может не быть в курсе, так что я хочу позволяют пользователям вводить свои собственные, если они не указаны. В этом случае они выберет «Other Make» из раскрывающегося списка, а затем введите команду make вручную.

Как вы представляете это в таблице ?

a. Как одно поле, make, которое может быть varchar(255). то есть, если они выберут существующий код, он просто будет скопирован в это поле
b. В качестве двух полей: make_id и make_other. Первый удерживает ключ от таблицы makes, а второй заполняется только в том случае, если они выбирают «другое».

---

Решение JQuery для показа/скрытия "Другой" текстовое поле:

$('select>option').filter(function() { 
    return !!$(this).data('other'); 
}).each(function() { 
    $(this).closest('div.row').next().toggle($(this).is(':selected')); 
    $(this).parent().on('change', function() { 
     if($(':selected',this).data('other')) { 
      $(this).closest('div.row').next().show().find('input').focus(); 
     } else { 
      $(this).closest('div.row').next().hide().find('input').val(''); 
     } 
    }); 
}); 

Просто добавьте data-other="1" к "Другое (пожалуйста, укажите)" <option>. Предполагает, что ваши входы выложены в <div class="row"> - изменить для других макетов.

Answer 1

Я предпочитаю первый выбор хранения информации в базе данных по следующим причинам:

• Это лучше для меня, чтобы сохранить все данные в базе данных
• большую часть времени клиент попросит сделайте его изменчивым, на самом деле они попросят некоторый экран, чтобы они могли изменять (добавлять, удалять, обновлять) эту информацию
• Это простая задача загрузить большую часть (если не все) этой информации в кеш при запуске системы, и, следовательно, мне не нужно звонить в базу данных для загрузки всех данных.

И как хранить в базе данных, я предпочел бы иностранную технику колонки, и я не буду использовать второй столбец для хранения значения по двум причинам

• Во-первых, большую часть времени I загрузит таблицу Other в кеш, поэтому я не беспокоюсь о проблеме с производительностью базы данных.
• Для сценария, когда клиент хочет обновить значения таблицы Other, мне не нужно передавать все таблицы, в которых хранятся значения и изменить его.

Для некоторых ситуаций я не возражаю, используя String первичный ключ для таблицы Other, и, следовательно, я бы хранить значения непосредственно и сохранить Other таблицы для описания и любой связанной с ними информации. поскольку в большинстве случаев размер таблицы будет очень мал по сравнению с основными таблицами в системе (сотрудник, пользователи, тележки, продукты и т. д.). Однако я должен гарантировать, что строковые значения будут очень редко обновляться (например, таблица стран).