RJSテンプレートを使用して一時的にフォームを無効にする方法

Question

Ruby on Rails 3を使用しています.RJSコールバックを使用したいと思います。私はhereから、次のコールバックがあることを読んでいます：：作成、：未初期化、：読み込み、：読み込み、：対話型、：完了、：失敗、：成功、しかし、それらを使用する方法？

誰かが私に例を挙げることはできますか？また、役に立つリソースへのリンクを投稿することもできます。

は、私の場合は、保存が完了するまで、送信ボタン上とをクリックした後、簡単なフォーム無効したいと思います。

<%= form_for(@account, :remote => true, :id => "form_id") do |f| %> 
    <%= f.text_field :name, :html => { :id => "text_field_id" }) %> 
    <%= f.file_field :name, :html => { :id => "file_field_id" }) %> 
    <%= f.submit "Submit", :id => "button" %> 
<% end %> 

PS：フォームはこのようなものです。私はファイル「RAILS_ROOT /公共/ Javaスクリプト（application.js」について読みますが、オンラインで良いドキュメントがありません

Answer 1

あなたは:disable_with => 'Saving...'見てきました送信ボタンのコード？これは、あなたがしようとしている理由で作成されたものです。実際には、データ属性 'data-disable-with'を送信ボタンに追加します。

実際に全体のフォームを使用すると、javascriptドライバのロジックを直接レールに取り込み、フォーム全体を無効にすることができます。

例として無効-とjQueryのドライバのコードは、あなたが、これはjQueryのバージョンであるとして、プロトタイプのためrails.jsファイルで調べる必要があり、プロトタイプのため

/** 
    * disable-with handlers 
    */ 
    var disable_with_input_selector = 'input[data-disable-with]'; 
    var disable_with_form_selector = 'form[data-remote]:has(' + disable_with_input_selector + ')'; 

    $(disable_with_form_selector).live('ajax:before', function() { 
     $(this).find(disable_with_input_selector).each(function() { 
      var input = $(this); 
      input.data('enable-with', input.val()) 
       .attr('value', input.attr('data-disable-with')) 
       .attr('disabled', 'disabled'); 
     }); 
    }); 

    $(disable_with_form_selector).live('ajax:complete', function() { 
     $(this).find(disable_with_input_selector).each(function() { 
      var input = $(this); 
      input.removeAttr('disabled') 
       .val(input.data('enable-with')); 
     }); 
    });