Rails Form_For/JqueryとImagesで選択してください

Question

私はこの問題の最善のアプローチを1週間以上探しています（はい、私は初心者です）。私のアプリケーションでは、ユーザーはプロジェクトを作成し、自分のデータベース内のプラントオブジェクトの選択肢との関係（ "pfollow"）を構築します。

私は今まで "listselect"と呼ばれていたドロップダウンメニューを使ってcollection_selectを使っていましたが、これはうまくいきますが、プラントの選択肢をイメージとして機能させたいどのソートのドロップダウンメニューでもなく、グリッドとして、またはクリック時に特定のJquery-UIエフェクトを持つ画像のサークル内に表示されます。 collection_selectは現在、次のようになります。私は今、把握することはできませんどのような

<%= form_for @project.prelationships.build(:pfollowed_id => 
             @project_id) do |f| %> 
     <%= collection_select :prelationship, :pfollower_id, Plant.all, :id, 
          :group, {},:multiple => true, 
          :class => "listselect" %> 
     <%= hidden_field_tag :project_id, @project.id %> 
    <div class="actions"> 
     <%= f.submit "Pfollow" %> 
    </div> 
    <% end %> 

です：私のページでこれらの植物の画像を特長とコントローラに選択された植物を渡すための最良の方法は何ですか？

a）「Simple Photo Manager」や「Selectable-Display as Grid」のようなJquery-UIプラグインをビルドしてから、「ui」のliクラスをキャプチャしようとします。選択されました。しかし、これを行うと、選択したオブジェクトのクラスをcollection_selectに戻す方法がわかりません。オンラインで良い解決策を見つけられませんでした。

b）collection_selectのhtml optionsブロックを使用して、一部のJqueryが追加されたイメージ選択を作成することも可能ですか？私はこのや良いプラグインを行う上でのドキュメントを見つけることができません。

c）collection_selectを使用せずにselectページで各プラントイメージを一意のオブジェクトとして扱い、Ajax <でクリックすると即座に適切な関係を作成する各プラントイメージを独自の "form_for image_tag"にしますこれは、C（に似て

D）が可能であるならば）必ず、各工場の画像独自のオブジェクト行い、その後、クリックしたときに、ui.selectedをキャプチャし、このようなヘルパーのform_forするためにそれを渡します

<%= form_for @project.prelationships.build(:pfollowed_id => 
             @project_id) do |f| %> 

を

でも、選択した画像をどのように渡すことができるのかわかりません：pfollowed_id that t彼はform_forヘルパーがコントローラに渡すために使うことができます。

ありがとうございます！

最後に、私のコードは実際にはこのように見えました。それでもCSSとjQueryを使ってプレイしている：

<%= form_for @project.prelationships.build(:pfollowed_id => 
             @project_id) do |f| %> 
    <% Plant.all.each do |plant| %> 
     <%= label_tag "prelationship[pfollower_id][]", plant.name %> 
     <%= check_box_tag "prelationship[pfollower_id][]", plant.id %> 
    <% end %> 
    <%= hidden_field_tag :project_id, @project.id %> 
    <%= f.submit "Pfollow" %> 
    <% end %> 

Answer 1

ありますが、おそらくjQueryのなどを使用して実装することができUI-魔法の多くかもしれないが、私はチェックボックスでドロップダウンを交換するための簡単な方法を提案します -

<%= form_for(prelationship) do |f| %> 
    <% Plant.all.each do |plant| %> 
    <%= label_tag plant.name %> 
    <%= check_box_tag "prelationship[pfollower_ids]" %> 
    <% end %> 
<%= end %> 

このコードは、植物のそれぞれのチェックボックスと、対応するラベルを作成し、フォームがポストされたとき、params[:prelationship][:pfollower_ids]は、次のことができ、さらにUIを強化するために、すべてのpfollower_ids

のリストが含まれていますラベルをimage_tagに置き換えて、イメージラベルがクリックされるたびに、対応するチェックボックスをチェック/チェック解除するJsがあります。チェックボックスを削除する場合は、CSSで非表示にするか、hidden_field_tagを使用してチェックボックスを完全に削除してください。