如何使用RJS模板暂时禁用表单

时间:2011-02-04 01:10:10

标签: ruby-on-rails ruby ajax ruby-on-rails-3 callback

我正在使用Ruby on Rails 3,我想使用RJS回调。我从here读到有以下回调:: create,:uninitialized,:loading,:loaded,:interactive,:complete,:failed,:success,但是如何使用它们

有人可以举个例子吗?或者发布链接到一些有用的资源?

在我的情况下,我想在提交按钮和上单击之后禁用一个简单的表单,直到保存完成。表格是这样的:

<%= 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 %>

P.S。:我读到了关于文件'RAILS_ROOT / public / javascripts(application.js')但在线没有好的文档。

1 个答案:

答案 0 :(得分:1)

您是否查看了提交按钮的:disable_with => 'Saving...'代码?这是为了您正在尝试的原因而创建的。所有这些实际上都是将数据属性'data-disable-with'添加到提交按钮。

如果您确实要禁用整个表单,可以直接从rails中的javascript驱动程序获取逻辑,并将其更改为禁用整个表单。

作为示例,jQuery驱动程序的disable-with代码是

    /**
     * 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'));
        });
    });