1

テーマごとにグループ化された多くの選択入力があるフォームがあります。グループごとにマスター選択があり、ユーザーはグループ内のすべての選択をマスター値に設定できます(gradescalesは、グレード1〜8を提供する方法です)。

どうすればこれを乾かすことができますか?

<label>Change all to:</label>
<%= select_tag "section_one", options_for_select(gradescales), :id => "section_one_master" %>
    
    <div id="section_one_wrapper">
      <%= f.input :item_one,   :collection => gradescales %>
      <%= f.input :item_two,   :collection => gradescales %>
      <%= f.input :item_three, :collection => gradescales %>
      <%= f.input :item_four,  :collection => gradescales %>
    </div>

jquery関数は次のようになります。

$("#section_one_master").change( function() { 
   var a = $("#section_one_master").val(); 
   $("#section_one_wrapper select").val(a);
 });

$("#section_two_master").change( function() { 
   var a = $("#section_two_master").val(); 
   $("#section_two_wrapper select").val(a);
 });    

 ...again, and again

したがって、section_one_masterが変更されると、関数がヒットし、section_one_wrapper div内のすべての選択入力が、マスターで選択された値と一致するように変更されます。

私には多くのグループがあり、それぞれにマスター選択入力があります。これを1つの関数まで乾燥させてから、最初に関数を呼び出したマスターを動的に識別し、規則を使用して、選択した適切なグループを変更するにはどうすればよいですか?

4

3 に答える 3

1

マスターセクション要素にクラスを追加できます。

$(".section-masters").change( function() {  
    var id = this.id.replace('master', 'wrapper');   
    $('#' + id + " select").val(this.value);
});

変更ハンドラーthisが要素を参照するコンテキストでは、要素を再選択する必要がないことに注意してください。

セクションラッパー要素を選択してオブジェクトをキャッシュし、メソッドを使用することもできます。オブジェクトをfilterキャッシュすることで、これらの要素を1回だけ選択します。これは、再選択するよりも優れています。

var $wrappers = $('.section-wrappers');
//...
$wrappers.filter('[id="' + id + '"]').val(this.value);  
于 2013-01-04T01:27:24.297 に答える
1

うん、@ Blazemongerが言ったように、クラスを使うことができ、それは大いに役立つだろう

しかし、あなたもこれを行うことができます

var foos = ['one', 'two'];

$.each(foos, function(index, elem){
  var $selector = $("#section_" + elem + "_master");
  $selector.change( function() { 
   var a = $selector.val(); 
   $("#section_" + elem + "_wrapper select").val(a);
  });
});

しかし、完全に!あなたがクラスを使うことができるならば、それをしてください!

于 2013-01-04T01:29:11.853 に答える
0

最終的に各マスターにクラスとIDを追加し、各セクションをIDでラップしました。それから私のコーヒースクリプトで:

  $(".master_change").change -> $("div##{@.id}_section select").val $(@).val()

スクリプトは任意の.master_changeによってトリガーされ、「this」からIDを取得し、「_ section」に追加されて、そのセクションのラッパーが選択されます...そしてもちろん、マスターに一致するようにすべての値を変更します。1行に12行!

于 2013-01-17T01:32:54.547 に答える