2008-09-17 10 views
4

Я хочу иметь текстовое поле, которое пользователь может ввести, в котором отображается список имен моей модели, заполненный Ajax, а затем, когда пользователь выбирает его, я хочу, чтобы HTML сохранил идентификатор модели и использовал его, когда форма .В Rails, что лучший способ получить автозаполнение, которое показывает имена, но использует идентификаторы?

Я уже высунул плагин auto_complete, который был вырезан в Rails 2, но, похоже, он не подозревает, что это может быть полезно. Существует Railscast episode, который охватывает этот плагин, но он не затрагивает эту тему. Комментарии point out that it could be an issue и point to model_auto_completer as a possible solution, которые, похоже, работают, если просмотренные элементы являются простыми строками, но вставленный текст включает в себя большое количество нежелательных пространств, если (как я хотел бы сделать) вы включаете изображение в элементы списка, despite what the documentation says.

Возможно, я мог бы взломать model_auto_completer в форму, и я все еще могу сделать это, но я очень хочу узнать, есть ли лучшие варианты там.

ответ

0

У меня есть испуганное исправление для нежелательных пространств от изображения. Я добавил :after_update_element => "trimSelectedItem" в хэш-код опций model_auto_completer (это первый хэш из трех данных). Мой trimSelectedItem затем находит соответствующий подэлемент и использует содержимое, что для значения элемента:

function trimSelectedItem(element, value, hiddenField, modelID) { 
    var span = value.down('span.display-text') 
    console.log(span) 
    var text = span.innerText || span.textContent 
    console.log(text) 
    element.value = text 
} 

Однако, это то идет вразрез с :allow_free_text вариант, который по умолчанию изменяет текст обратно, как только текст коробка теряет фокус, если текст внутри не является «действительным» элементом из списка. Поэтому мне тоже пришлось отключить это, передав :allow_free_text => true в хэш настроек (опять же, первый хеш). Однако я бы предпочел, чтобы это продолжалось.

Так что мой текущий вызов, чтобы создать autocompleter является:

<%= model_auto_completer(
    "line_items_info[][name]", "", 
    "line_items_info[][id]", "", 
    {:url => formatted_products_path(:js), 
    :after_update_element => "trimSelectedItem", 
    :allow_free_text => true}, 
    {:class => 'product-selector'}, 
    {:method => 'GET', :param_name => 'q'}) %> 

И продукция/index.js.erb является:

<ul class='products'> 
    <%- for product in @products -%> 
    <li id="<%= dom_id(product) %>"> 
      <%= image_tag image_product_path(product), :alt => "" %> 
      <span class='display-text'><%=h product.name %></span> 
    </li> 
    <%- end -%> 
</ul> 
1

Я катался самостоятельно. Процесс немного запутан, но ...

Я просто создал текстовое поле в форме с наблюдателем. Когда вы начинаете вводить текстовое поле, наблюдатель отправляет строку поиска, а контроллер возвращает список объектов (максимум 10).

Объекты затем отправляются для рендеринга через частичный, который заполняет результаты динамического автозаполнения. Частично фактически заполняет линии link_to_remote, которые снова отправляются обратно на контроллер. Link_to_remote отправляет идентификатор пользователя, а затем RJS очищает поиск, заполняет имя в текстовом поле и затем помещает выбранный идентификатор в скрытое поле формы.

Фу ... Я не мог найти плагин, чтобы сделать это в то время, поэтому я откатился, я надеюсь, что все это имеет смысл.