0

私は次のようなブロックを持っています:

      - competitors.each do |competitor|
        %dl
          %dt
            ...
          %dd
            %span{:id => "#{competitor['watchers']}"}= "#{((competitor['watchers']*100.0)/30000).round.to_f}%"

各ブロック クリクルに 1 つずつ動的な CSS ID を生成することに注意してください。結果として、html は異なる dd --> span --> id number のリストになります。

<dl>
  <dt>
    ...
    <dd>
      <span id="774">93.0%</span>
    </dd>
  </dt>
</dl>
<dl>
  <dt>
    ... 
    <dd>
      <span id="13774">46.0%</span>
    </dd>
  </dt>
</dl>

「カスタムCSSスニペット」をさまざまなcss ID( #13774 #774 )に「動的に」関連付けたい:

:javascript
  $("##{competitor['watchers']}").css({ width: "#{((competitor['watchers']*100)/30000)}px" });

link_to 種類のヘルパーなしで (Rails 3.2.3 ':remote => true' で) ajax を呼び出すにはどうすればよいですか?

今までは、次のように内側のブロックから JS を呼び出してみました。

      - competitors.each do |competitor|
        :javascript
          $("##{competitor['watchers']}").css({ width: "#{((competitor['watchers']*100)/30000)}px" });
        %dl
          %dt
            ...
          %dd
            %span{:id => "#{competitor['watchers']}"}= "#{((competitor['watchers']*100.0)/30000).round.to_f}%"

コードが DOM に挿入されることはありません。

4

1 に答える 1

1

ある種の棒グラフを表示しようとしているようです。その場合は、次のことをお勧めします(タグ付けされているのは、jQueryを使用していると想定しています)。

ブロックを変更して、各スパンに一意のクラスを追加します。これにより、後でスタイルのメリットが得られます。

%dd
        %span{:id => "#{competitor['watchers']}", :class => "progress-bar"}= "#{((competitor['watchers']*100.0)/30000).round.to_f}%"

次に、ページの下部にあるjQueryを使用してそれぞれを選択し、基本的な計算を行うことができるはずです。

$('span.progress-bar').each(function(index,element){
    var num = $(element).attr('id'); // get element id
    var width = parseInt(num * 100 / 30000); // do your math, then get the integer value for width
    $(element).css('width',width+'px'); // set width
}

あなたがajaxを探していたのは知っていますが、何かが足りない場合を除いて、これは文書化されているように問題の解決に近づくはずです。

于 2012-05-01T11:28:29.630 に答える