Question

我想对错误消息使用一些Scriptaculous效果。

<% form_for(@page) do |f| %>
    <%= f.label :name %>
    <%= f.text_field :name %>
    <%= f.error_message_on "name" %>

    <%= f.label :content %>
    <%= f.text_field :content %>
    <%= f.error_message_on "content" %>

    <%= f.submit 'Create' %>
<% end %>

我的第一个想法是将错误消息放入div标签并在控制器中使用page.visual_effect。但我不知道如何选择会受到影响的正确div。

<% form_for(@page) do |f| %>
    <%= f.label :name %>
    <%= f.text_field :name %>
    <div id="errorname"><%= f.error_message_on "name" %></div>

    <%= f.label :content %>
    <%= f.text_field :content %>
    <div id="errorcontent"><%= f.error_message_on "content" %></div>

    <%= f.submit 'Create' %>
<% end %>

或者我应该将一些if条件放入视图并从那里调用它们。顺便说一句我不知道怎么做。我们不能做像f.error_message_on "name", :visual_effect => ...这样的事情。任何帮助都将受到赞赏。

Answer 1

你在div中包装正确，但你可以在视图中这样做：

<%= f.error_message_on "name",
      :css_class => "inputError" %>

可能有很多方法可以做到这一点。让控制器返回rjs是一种方法。为了不引人注意，被认为是最佳实践，您需要包含一个javascript文件，在加载页面时触发scriptaculous方法。我使用低专业库来进行不引人注目的javascript。这是我的建议：

布局文件：

<%= javascript_include_tag :defaults, ‘lowpro’, 'form_behaviors.js' %>

javascript_file_for_form_actions.js：

Event.addBehavior({ 
  '.inputError' : function() {
    this.hide();
    this.blindUp();
  }
});

您还可以使用content_for有条件地加载javascript文件并更改布局文件。

查看文件：

<% content_for(:javascript) do %> <%= javascript_include_tag “form_behaviors” %>
<% end %>

布局文件中的某处：

<% yield :javascript %>

您也可以获得包含lowpro的unobtrusive plugin。有关更多信息Peepcode有一个关于lowpro的好pdf，以及一些关于javascript的好的截屏视频。

Answer 2

只需将您的错误消息放在可识别的元素中，例如：

<div id="bob">error messages here</div>

然后在你的javascript中你可以做类似的事情：

$('bob').blindUp();

如何对错误消息使用Scriptaculous效果

2 个答案: