1

A、B、および C の 3 つのドロップダウンがあるフォームがあります。A が変更されると、B はオプションの新しいリストで更新され、C はクリアされます。B が変更された場合、C はオプションの新しいリストで更新する必要があります。

A、B、および C のパーシャルがあり、A と B の両方にobserve_field自分自身を監視するための呼び出しが含まれています。

A が変更されるたびに、B がリロードされ、新しいオブザーバーが追加されます。つまり、B が変更されるたびに、C をリロードする N+1 要求がトリガーされます (N は A が変更された回数です)。

B のドロップダウンを置き換えるパーシャルから呼び出しを移動しようとしましたがobserve_field(代わりに A のパーシャルに配置しました)、A への最初の変更の後、B はイベントをトリガーしなくなりました。

$('b').stopObserving();また、B のオブザーバーの呼び出しを追加しようとしまし:beforeたが、同じ効果があります。A への最初の変更の後、イベントは B でのトリガーを停止します。

これを機能させる方法はありますか？

編集：

observe_field呼び出しによって生成される Javascript は次のとおりです。

new Form.Element.EventObserver('a', function(element, value) {
  $('b_loading_indicator').show();
  new Ajax.Updater('b',
    'http://localhost:3000/foos/b_control', {
      asynchronous: true,
      evalScripts: true,
      onComplete: function(request) { $('b_loading_indicator').hide(); },
      parameters: 'a_id=' + encodeURIComponent(value) + '&object_name=foo' + '&authenticity_token=' + encodeURIComponent('kH/TmOfvSKeNLxO4N0gxtqV0niNfAUlJ3guk6KAvPig=')
    });
});

new Form.Element.EventObserver('b', function(element, value) {
  $('c_loading_indicator').show();
  new Ajax.Updater('c', 
    'http://localhost:3000/foos/c_control', {
      asynchronous: true,
      evalScripts: true,
      onComplete: function(request) { $('c_loading_indicator').hide(); },
      parameters: 'a_id=' + encodeURIComponent($('a').value) + '&b_id=' + encodeURIComponent(value) + '&object_name=foo' + '&authenticity_token=' + encodeURIComponent('kH/TmOfvSKeNLxO4N0gxtqV0niNfAUlJ3guk6KAvPig=')
  });
});
4

1 に答える 1

0 
 $(document).ready(function() {
   $("#section").bind("keyup", function() {
   data = {this.name: this.val()}; // the value of input that need to send to server
   $.get(url, data, // make ajax request
     function(html) { // function to handle the response
      $("#article_list").html(html); // change the inner html of update div
     });
   });
 });
于 2013-05-03T09:19:32.247 に答える