これまでに私を助けたページ:
期待される結果:
- select2 を select 要素に適用します。その瞬間から、私は再び自分で物事を修正し始めます。
実際の結果:
- Select2 は select 要素には適用されません。
これまでに行った手順:
- それをgemに追加し、バンドルインストールを行います。
//= require select2このように追加
:
//= require jquery
//= require jquery_ujs
//= require bootstrap/modal
//= require turbolinks
//= require select2
//= require_tree .
- require select2 と require select2-bootstrap を application.css に追加しました
:
*= require select2
*= require select2-bootstrap
*= require_tree .
*= require_self
*/
- 私の
name.html.erb中には：
:
<%= f.label :tag_list, "Topics" %>
<%= f.select(:tag_list, Tag.all.order(:name).collect { |a| a.name }, {}, id: "tag_list1", label:'Tags', :multiple => true)%>
私は作成しましたTag.rb（データはデータベースに保存されます）：
class Tag < ApplicationRecord
validates_presence_of :name
end
- 最後のステップ（私が理解していることから）では、機能を要素に適用します（コードを の
application.js下に追加します//= require_tree .）：$( "#dropdown" ).select2({ theme: "bootstrap" });
これを次のように変更しました:
$( "#tag_list1" ).select2({
theme: "bootstrap"
});
コンソール：
Uncaught TypeError: $(...).select2 is not a function
私はこれを解決します：
(function($){
$(document).on('ready', function(){
$("#tag_list1").select2({
theme: "bootstrap",
tags: true
});
});
}(jQuery));
期待される結果:
- select2 を select 要素に適用します。
実際の結果:
- Select2 は select 要素には適用されません。
お知らせ下さい。
更新 1 これは html 出力です。
<input name="item[tag_list][]" type="hidden" value="">
<select id="tag_list1" label="Tags" multiple="multiple" name="item[tag_list][]">
<option value="12">dev tool</option>
</select>