0

Rails Helpers を使用して、Javascript の onclick メソッドに似た機能を実装しようとしています。

Rails 2.0.2 と Ruby 1.8.7 で複数のフィールドにオートコンプリート機能を実装しました。この構成は Ubuntu 10.04 で実行されます。はい、わかっています。Rails 3.x があるのになぜ Rails 2.x なのかを感じるかもしれませんが、それはプロジェクト固有の目的によるものです。私はそれについて多くの選択肢がありません..:) .

ユーザーがオートコンプリート機能のテキスト フィールドに入力する基本的な検索クエリとして、特定の「タイトル」に基づいて、グループ固有のプロフィール写真、グループ タイトル、およびグループに属するメンバーの総数を正常に取得できます。実施中です。上記のシナリオでオートコンプリート機能を機能させること自体が課題でした。

オートコンプリートに関して私が実装した内容について理解を深めることができない場合は 、Rails の複数のフィールドに対してオート コンプリートを実装するを参照してください 。

http://imagepaste.nullnetwork.net/viewimage.php?id=2048 、 http://imagepaste.nullnetwork.net/viewimage.php?id=2050を参照して、私が実装したものをよりよく理解することもできます。 およびhttp://imagepaste.nullnetwork.net/viewimage.php?id=2049。

グループ固有のプロフィール写真の名前は、写真に .jpg が追加されることを除いて、グループ タイトルの名前と同じであることに注意してください。

私は、カスタマイズされたオート コンプリート メソッド、オート コンプリート プラグイン、および Rails パーシャルを利用しています。カスタマイズされたオート コンプリート メソッドにより、要件に合わせて基本機能を変更できます。

私の質問に来て、私が実装したオートコンプリート機能に従って、ユーザーがテキストフィールドに「I」を入力した場合、結果（複数の一致が見つかった場合（つまり、で始まる複数のグループが存在する場合） 「I」) 特定の検索クエリで) ユーザー インターフェイスに入力されたものには、次のすべてが含まれます。

  • タイトルと同じ名前で始まるグループ固有のプロフィール写真。この場合は「I%」.jpg
  • グループのタイトル名。
  • グループに所属する総メンバー数

グループ名として India と Independence があるとすると、オートコンプリート テキスト フィールドに次の結果が表示されます。

India.jpg(image will be displayed)     India(Group title name displayed)               3(dummy value here)

同様に

Independence.jpg                     Independence
4

これらすべてが 1 つのテキスト フィールドに表示されます。括弧内のコメントは、オート コンプリートによって返される結果の一部ではないことに注意してください。

UI がどのように見えるかイメージできない場合は、アカウントが作成されたら、www.diasp.org に登録し、その検索機能を使用して任意のユーザーを検索してください。

画像、タイトル名、グループ メンバーの合計数の間のスペースが大きすぎることに注意してください。これについては、次のコメントで再度参照します。

これをすべてレンダリングするパーシャルのコードは次のとおりです。

<ul>
  <% for inv_group in @investor_group2 %>
  <%=image_tag "investor_groups/#{inv_group.title}.jpg" , :width =>

'40', :高さ => '22', :align => '左' %>

  • <%=h inv_group.title %>(<%=h inv_group.activated_members.size %>)
    • <%終了%>

    ここで、ユーザーがマウスをインドなどの上に置いてクリックすると、テキスト フィールドに が入力され**India(3)**ます。

    私が実装する必要があるのは、Group title のみを 選択するRails のクリックです。グループのタイトルとグループのサイズを個別のタグで実装しようとしましたが、マウスオーバーしてタイトルのみを選択し、テキスト フィールドに入力することができました。<li>

    このアプローチの問題は、画像、タイトル、およびグループサイズの間のフォーマットとスペース/ギャップが完全に損なわれることです。これには、UI のルック アンド フィールを向上させるために書式設定が必要です。

    3つのtitle.jpg、title、およびグループサイズのそれぞれの間のフォーマットスペースを減らす方法を理解できれば。このオプションは代替の修正と見なすことができますが、最善の修正ではない可能性があります。

    私はRoRの多くのことについて初心者であるため、どうすれば同じ（提案された修正）に進むことができるかよくわかりません。RoR のどのコマンドを使用して、自分のタスクを簡素化/解決するのに役立つかについてはよくわかりません。これについて私を助けてくれませんか。

    また、このシナリオをより効率的に修正するための提案もありがたく思います。

    後で、JavaScriptのonclickイベントを使用することで、問題を解決できることがわかりました。Rails Helpersを使用した場合の同等の構文についてはよくわかりません 。私の目的のためにjavascript_tagをどのように使用できるか、しかしこれが方法である場合、私は自分の要件に合わせて基本的な構文を変更する方法について本当に無知です. 可能であれば、同じことを手伝ってください。

    ありがとうございました..

    4

    2 に答える 2

    1

    Script.aculo.us Ajax.Autocompleter には、まさにこの種の単純な機能があります。自動入力された結果から除外したい要素は、span.informal タグでラップするだけで済みます。したがって、結果は次のようになります。

    <li>
    <span class="informal">[img tag]</span>
    India
    <span class="informal">whatever else</span>
</li>

    オートコンプリーターのヒント リストでこの結果をクリックすると、インドという単語だけがテキスト フィールドに入力されます。

    于 2011-04-12T13:52:17.190 に答える
    0

    http://www.ruby-forum.com/topic/1475454?reply_to=992312からのWalterの提案に追加します。

    以下のこのコードは私のために魔法をかけました...

    <ul>
  <%= javascript_include_tag :defaults, :cache => true %>
  <%=stylesheet_link_tag "groups"%>
  <% for inv_group in @investor_group2 %>

   <li><div class="autocomp_field_width_modify" ><%=image_tag "investor_groups/#{inv_group.title}.jpg" , :width => '40', :height => '22', :align => 'left' %><%=h inv_group.title%><span class="informal">(<%=h inv_group.activated_members.size %>)</span></div></li>

  <%end%>
</ul>

    そして私のgroups.cssに以下を追加しました：-

    .autocomp_field_width_modify
{
      text-align: justify;
      text-indent: 3%;
}

    Walterの提案に感謝します。私は、HTMLマークアップ標準に正確に準拠していない可能性があることを知っています（HTMLの概念を強化するために、まだ多くのことをカバーする必要があります。）。しかし、最終的にこれが要件に基づいて機能することを嬉しく思います。

    もう一度ありがとう..ウォルター..

    于 2011-04-13T09:32:15.560 に答える