如何在 twitter bootstrap 中使用 Best In Place [英] how to use Best In Place with twitter bootstrap

问题描述

我还没有看到任何相关文档..

I haven't seen any documentation from this..

如果我有

<%= best_in_place @user, :city,  type=> :input, %>

我需要包含 data-provide="typeahead"

I need to include the data-provide="typeahead"

<%= best_in_place @user, :city, type=> :input,:data => {:provide => "typeahead"} %>

并包含来源

<%= best_in_place @user, :city, :type=> :input, :data => {:provide => "typeahead", :source => City.getcities.to_json} %>

假设 City.getcities.to_json 返回一个带有城市名称的正确 json 列表

assume City.getcities.to_json returns a proper json list with city names

这不起作用...

推荐答案

使用 :data 选项，您可以在生成的 span 上设置 data- 属性 而不是 input 本身.

With the :data option you can set the data- attibutes on the generated span and not on the input itself.

如果你想在生成的 input 元素上添加属性，你需要使用 :html_attrs 选项:

If you want to add attributes on the generated input element you need to use the :html_attrs options:

<%= best_in_place @user, :city, :type=> :input, 
    :html_attrs => {:'data-provide' => "typeahead", 
                    :'data-source' => City.getcities.to_json} %>

但是 - 正如 @Nick Ginanto 指出的那样 - 提前选择仅适用于使用键盘，而不适用于鼠标(可能是因为 引导程序中的错误，或者因为有 没有官方支持最好的引导)

However - as @Nick Ginanto pointed out - the typeahead selection only works with using the keyboard and not with the mouse (maybe because of a bug in bootstrap or because there is no official support in best in place for bootstrap)

但是下面的代码片段似乎解决了这个问题:

But the following code snippet seems to solve this issue:

$('ul.typeahead').live('mousedown', function(e) { e.preventDefault(); });

这篇关于如何在 twitter bootstrap 中使用 Best In Place的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！