Rails + Bootstrap 标签输入 + 提前输入
Rails + Bootstrap Tags Input + typeahead
我正尝试在 rails 的小项目中设置此功能:http://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/
但我不确定我做错了什么。我将 jquery、bootstrap-tagsinput 和 typeahead.bundle 文件放入我的 app/assets/javascript,但我仍然无法让它工作。
我在我的表格中添加了:
<input type="text" data-role="tagsinput" />
<%= javascript_tag do %>
$('input').tagsinput({
typeahead: {
source: ['Amsterdam', 'Washington', 'Sydney', 'Beijing', 'Cairo']
}
});
<% end %>
和一个 citynames.json 到我的 app/assets 文件夹,以及添加
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
到顶部,但是虽然标签输入本身有点工作,但我无法让预输入工作或添加 freeInput: false 选项并使它工作。
从 /src
得到 bootstrap-tagsinput.css
并放入 /assets/stylesheets/
.
如果您使用 scss
,请将 bootstrap-tagsinput.css
重命名为 bootstrap-tagsinput.scss
在applications.scss@import 'bootstrap-tagsinput'
或require
从/src
得到bootstrap-tagsinput.js
并放入/assets/javascript/
在assets/javascript/application.js
需要你的js=//require bootstrap-tagsinput
prefetch: {
url: 'assets/citynames.json',
filter: function(list) {
return $.map(list, function(cityname) {
return { name: cityname }; });
}
}
url: 'assets/citynames.json'
- 这是行不通的。您可以从控制器提供 citinames 或将此文件放在 public 中,然后您可以从 public 文件夹 root_url/folder/citinames.json.
中获取此 json
我正尝试在 rails 的小项目中设置此功能:http://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/
但我不确定我做错了什么。我将 jquery、bootstrap-tagsinput 和 typeahead.bundle 文件放入我的 app/assets/javascript,但我仍然无法让它工作。
我在我的表格中添加了:
<input type="text" data-role="tagsinput" />
<%= javascript_tag do %>
$('input').tagsinput({
typeahead: {
source: ['Amsterdam', 'Washington', 'Sydney', 'Beijing', 'Cairo']
}
});
<% end %>
和一个 citynames.json 到我的 app/assets 文件夹,以及添加
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
到顶部,但是虽然标签输入本身有点工作,但我无法让预输入工作或添加 freeInput: false 选项并使它工作。
从
/src
得到bootstrap-tagsinput.css
并放入/assets/stylesheets/
.如果您使用 scss
,请将 在applications.scss
@import 'bootstrap-tagsinput'
或require
从
/src
得到bootstrap-tagsinput.js
并放入/assets/javascript/
在
assets/javascript/application.js
需要你的js=//require bootstrap-tagsinput
bootstrap-tagsinput.css
重命名为 bootstrap-tagsinput.scss
prefetch: {
url: 'assets/citynames.json',
filter: function(list) {
return $.map(list, function(cityname) {
return { name: cityname }; });
}
}
url: 'assets/citynames.json'
- 这是行不通的。您可以从控制器提供 citinames 或将此文件放在 public 中,然后您可以从 public 文件夹 root_url/folder/citinames.json.