3.5. Buttons
本文共 2293 字,大约阅读时间需要 7 分钟。
3.5. Buttons
在前面form_to_remote例子中可以看到, 标准的表单和Ajax表单的唯一区别是在生成的HTML中多了一个onsubmit属性,剩余的表单和提交按钮,都是常见的HTML内容。form_to_remote用普通的提交按钮创建了一个特殊的,Ajax化的表单,submit_to_remote响应的可以为表单创建一个特殊的提交按钮。例如: <%= form_tag :action => 'reverse' %>
<p>Text to reverse: <%= text_field_tag 'text_to_reverse' %></p>
<p><%= submit_to_remote 'submit', 'Reverse!',
:update => 'reversed2',
:url => { :action => 'reverse' } %></p>
<p id="reversed2"></p>
submit_to_remote 的第一个参数是button的name属性,第二个参数是设置按钮的值,也就是按钮显示的内容,当你点击按钮之后,跟前面发生的情况一样。 然后,对于form的提交可以选择是否用Ajax方法实现。考虑下这两个提交按钮的不同: <%= form_tag :action => 'reverse' %>
<p>Text to reverse: <%= text_field_tag 'text_to_reverse' %></p>
<p id="reversed"></p>
<p><%= submit_to_remote 'submit', 'Submit via Ajax',
:update => 'reversed',
:url => { :action => 'reverse' } %></p>
<p><%= submit_tag "Submit non-Ajax" %></p>
在实际中,在submit_to_remote提交表单时先要对表单内容进行验证。例如,在一个注册用户的过程中,你需要加上验证检查用户名是否可用的功能。 3.5.1 . Buttons for Arbitrary Functions button_to_function helper 创建一个按钮来引发JavaScript的function。就像link_to_function一样,button_to_function的第一个参数是按钮显示的文本,第二个参数是Javascript(代码或是function名)。例如: <%= button_to_function "Greet", "alert('Hello world!')" %>
创建一个按钮来发起Ajax请求,你可以将button_to_function和remote_function联合起来使用。remote Helper使用和link_to_remote同样的参数,并且为remote运行返回需要的Javascript代码 <%= button_to_function
"Check Time",
remote_function(:update =>
"current_time",
:url => { :action => 'get_time' }) %>
<div id=
"current_time"></div>
3.5.2 . Custom Helpers Link_to_function 和link_to_remote的存在可能会让你觉得button_to_function应该也有一个对应的button_to_remote,但是很抱歉,没这么个东西。不过幸运的是,很容易实现!这也给了我们点启示,就是怎么样来实现用户helper,因为我们工作在chapter3这个controller中.那么定义用户helper可以放在app/helpers/chapter3_helper.rb或app/helpers/application_helper中,这样在模板中都可以使用。为了创建一个button_to_remote helper, 我们可以模仿Rails API中关于link_to_remote的做法: 第一个参数是按钮的标签,第二个是个hash格式的选项,这个hash选项会作为参数传入remote_function中。下面就是具体方法的定义: def button_to_remote name, options = {}
button_to_function name, remote_function(options)
end
现在你也看到了,这只是button_to_function的一个新包装,但是它现在有了一个跟link_to_remote一样的接口: <%= button_to_remote "Get Time Now",
:update => "current_time",
:url => { :action => 'get_time' } %>
<div id="current_time"></div>
编写用户helper通常是保持模板的整洁和可维护性的一条最佳途径。任何时候你发现你写了一个逻辑很复杂的方法或者是经常使用的方法,考虑下是不是该把它放到helper中呢? 本文转自 fsjoy1983 51CTO博客,原文链接:http://blog.51cto.com/fsjoy/91363,如需转载请自行联系原作者