Существует ли плагин, который создает опцию «Другое» в выпадающих меню и создает текстовое поле для альтернативного ввода при выборе «Другое»?

Question

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

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

Если я не могу найти подходящий плагин, я, вероятно, буду использовать Dojo dijit Combobox , и, хотя это будет именно то, что я ищу, идеальным для моих пользователей будет плагин select box, которыйв раскрывающемся списке есть параметр «Другое», а при выборе «Другое» для пользователей будет отображаться текстовое поле.Когда поле редактируется, ему также необходимо заполнить раскрывающийся список или текстовое поле соответствующим образом на основе значения, хранящегося в базе данных.Существует ли что-то подобное, либо в javascript / jquery / prototype / other, либо в плагине rails 3 или gem?Большое спасибо!

Редактировать: Скорее всего, я буду использовать FlexBox , если не могу найти что-то с отдельной текстовой областью - но я все еще ищу отдельную текстовую областьрешение!

Answer 1

Я собрал небольшой скрипт, который может делать то, что вы хотите: http://jsfiddle.net/nHh3C/ Определенно может быть улучшен, но я думаю, вы поняли идею.На самом деле мог бы использовать это сам: D

Вот JS:

$('select').each(function(i, select){
    if (!$(select).data('name')) {
        $(select).data('name', $(select).attr('name'));
    } 
    $(select).change(function(){
        if ($(this).val() == 'other') {
            $('<input/>', {
                'name' : $(this).attr('name')
            }).insertAfter($(this)); 
            $(this).attr('name', '');
        } else {
            $('input[name='+$(this).data('name')+']').remove();
            $(this).attr('name', $(this).data('name'));
        }
    });
});

EDIT Ах, и если это не было ясно - он использует jQuery.Просто измените селектор select на то, что вам нужно, и вы должны быть настроены.Не составит труда обернуть это в плагин.

РЕДАКТИРОВАТЬ 2 С помощью rails вы, вероятно, сможете сделать что-то подобное (возможно, приятнее в помощнике) для генерации выбора:

select("post", "person_id", Person.all.collect {|p| [ p.name, p.id ] } << ['Other', 'other'])

Для представления редактирования вы можете просто проверить, содержится ли значение в выбранных значениях, и, если нет, распечатать дополнительное поле ввода и установить для выбора предварительный выбор «других» параметров.,И вы должны обращаться с JS, чтобы соответствовать ситуации.