4

我想要一个用户可以输入的文本框，显示我的模型名称的 Ajax 填充列表，然后当用户选择一个时，我希望 HTML 保存模型的 ID，并在提交表单时使用它.

我一直在研究 Rails 2 中删除的 auto_complete 插件，但似乎没有暗示这可能有用。有一个Railscast 插曲涵盖了使用该插件，但它没有涉及这个主题。评论指出这可能是一个问题，并指出了model_auto_completer一个可能的解决方案，如果查看的项目是简单的字符串，这似乎可以工作，但如果（我想做）你插入的文本包含很多垃圾空格将图片包含在列表项中，尽管文档中说了什么。

我可能会变身model_auto_completer，我可能最终还是会这样做，但我很想知道是否有更好的选择。

4

2 回答 2

1

我自己滚动。这个过程有点复杂，但是......

我刚刚和观察者一起在表单上创建了一个 text_field。当您开始在文本字段中输入时，观察者发送搜索字符串，控制器返回对象列表（最多 10 个）。

然后通过填充动态自动完成搜索结果的部分将对象发送到渲染。部分实际上填充了再次回发到控制器的 link_to_remote 行。link_to_remote 发送用户选择的 id，然后一些 RJS 清理搜索，在文本字段中填写名称，然后将选定的 id 放入隐藏的表单字段中。

呼……我当时找不到一个插件来做这个，所以我自己做了，我希望这一切都有意义。

于 2008-09-17T08:56:13.780 回答
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所以我也必须通过传递选项散列（同样是第一个散列）来关闭它。不过，我真的宁愿它继续存在。

所以我目前创建自动完成器的调用是：

<%= 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'}) %>

products/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>
于 2008-09-17T09:13:17.717 回答