Select2 jQueryとRails ajaxフォーム

Question

私はRails4アプリケーションでjQuery select2プラグインを使用しています。

プラグインは私のためにajaxを使用していないフォームで動作しています。しかし、アヤックスのフォームの場合、私はそれを行う方法がわかりません。

があり、ここで、ブートストラップ3モーダル内部形式だ、私は同じことを読み込む方法は次のとおりです。

<%= link_to t(:new), new_address_path, remote: true, :class => 'btn btn-info' %> 

$('<%= j render "form", title: "#{t(:address)}" %>').modal(); 

がどのように私はこのフォーム内の選択のためのプラグインSELECT2を初期化することができますか？

Answer 1

あなたはjavascriptを使用してこの操作を行います。

// On document ready 
$(function(){ 

    $(document).bind('ajaxComplete', function() { 
    // Activate select2 after ajax request 
    activateJSPlugins(); 
    }); 

    activateJSPlugins(); 
}); 

function activateJSPlugins() { 
    // Find all dropdowns and initialize select2 
    $(".controls select").each(function() { 

    // Initialize select2 
    $(this).select2(); 
    }); 
} 

$(".controls select")はあなたSELECT2コントロールを見つけるために適用cssセレクタだろう。

/app/assets/javascripts/bootstrap_and_overrides.js

EDITはbootstrap_and_overrides.jsファイルを作成します。

/app/assets/javascripts/application.js

//= require bootstrap_and_overrides 

次に、このコードは

Answer 2

が、私はそれを正しく理解していました、すべてのselec2の入力に対して実行されますか？フォームは最初にページに表示されないモーダルですが、ユーザーとのやりとりの後に表示されます。この場合、ドキュメント上のreadyは、select2をアクティブにする要素を見つけられません。私は、livequeryプラグインを使用してDOMの変更を観察することをお勧めします。

$('form.modal').livequery('.controls select', 
    function(elem){ 
    $(elem).select2(); 
}) 

また、@Willemがjavascriptタグに提案した内容を、フォームのモーダルのhtml部分に入れることもできます。