1

次のコードを使用すると、通常のビューで正常に動作します。

.profile-searchbar.text-left                                                                                                                                                                                                          
  = form_tag(compare_path, method: 'get', remote: true, id: 'compare_form') do                                                                                                                                                        
    = select_tag "v_friend_id", options_from_collection_for_select(@v_friends, 
    :id, :full_name, @comparison.v_friend.id), 
    :include_blank => true, :class => "compare-search"

ただし、モバイルでレンダリングするモバイル ビュー (bootstrap col-xs) では、選択した値は更新されません。オリジナルのままです。通常のビューで変更してから画面を縮小すると、新しい値が表示されますが、モバイル ビューでこの select2 フォームを使用して選択することはできません。デフォルト値のみを選択しているようです。

設計上、元の select2 ドロップダウンを単純に縮小することはできないため、別のドロップダウンを作成したモバイル ビューの select2 オプションを次に示します。

= form_tag(compare_path, method: 'get', remote: true, id: 'compare_form') do                                                                                                                                 
  = select_tag "v_friend_id", options_from_collection_for_select(@v_friends, 
  :id, :full_name, @comparison.v_friend.id), 
  :class => "compare-searchM", :style => "width:90%; margin-left: 3px;"

select 2のJSは次のとおりです。

 $('.compare_btn').on('click', function () {
      $("#compare_form").submit();
    });

 $(".compare-search").select2({
      placeholder: "Search to compare",
      allowClear: true
    });

    $(".compare-searchM").select2({
      placeholder: "Search to compare",
      allowClear: true
    });

基本的に、同じ値を制御するには2つのselct2ドロップダウン/フォームが必要なようです..しかし、オリジナルだけがそれを制御していると思います..

4

0 に答える 0