要在rails中使用ajax,必须在视图(view)中引用对应的javascript文件,在view文件的< /head>标签中使用<%= javascript_include_tag :defaults %>来引入所有rails自动生成的位于public\script下面的.js文件,也可以使用<%= javascript_include_tag :prototype %>等来引入指定的.js文件,不过为了防止忘记引入,可以把这行代码放到application.rhtml或者某个controller对应的controller_name.rhtml中去。
关于javascript_include_tag的例子
javascript_include_tag "xmlhr" # =>
<script type="text/javascript" src="/javascripts/xmlhr.js"></script>
javascript_include_tag "common.javascript", "/elsewhere/cools" # =>
<script type="text/javascript" src="/javascripts/common.javascript"></script>
<script type="text/javascript" src="/elsewhere/cools.js"></script>
javascript_include_tag :defaults # =>
<script type="text/javascript" src="/javascripts/prototype.js"></script>
<script type="text/javascript" src="/javascripts/effects.js"></script>
...
<script type="text/javascript" src="/javascripts/application.js"></script>
现在,就可以使用ajax了,在需要的地方使用in_place_editor_field,由scaffold生成的show.rhtml是一个非常不错的地方,让我们把show.rhtml中的<%=h @contact.send(column.name) %>替换为<%= in_place_editor_field :class_name, :class_attribute %>,让我们看看in_place_editor_field都做了什么,找到它的源代码:
ruby 代码
- def in_place_editor_field(object, method, tag_options = {}, in_place_editor_options = {})
- tag = ::ActionView::Helpers::InstanceTag.new(object, method, self)
- tag_options = {:tag => "span", :id => "#{object}_#{method}_#{tag.object.id}_in_place_editor", :class => "in_place_editor_field"}.merge!(tag_options)
- in_place_editor_options[:url] = in_place_editor_options[:url] || url_for({ :action => "set_#{object}_#{method}", :id => tag.object.id })
- tag.to_content_tag(tag_options.delete(:tag), tag_options) +
- in_place_editor(tag_options[:id], in_place_editor_options)
- end
当然了,这个代码目前我还看不懂。。。等以后能看懂了再来研究,反正,现在先把它当作是一个具有ajax功能的textbox吧。
为了响应in_form_editor_field的ajax事件,需要在Controller中加入一段代码来自动生成响应时间的action,这段代码如下:
ruby 代码
- Contact.content_columns.each do |column|
- in_place_edit_for :contact, column.name
- end
你可以自由的选择把它放到controller的什么位置(只要不放到其他action内部),这段代码使用in_place_edit_for来自动生成了一系列的action,这个魔术是怎么变的呢?马上解开谜底:
ruby 代码
- def in_place_edit_for(object, attribute, options = {})
- define_method("set_#{object}_#{attribute}") do
- @item = object.to_s.camelize.constantize.find(params[:id])
- @item.update_attribute(attribute, params[:value])
- render :text => @item.send(attribute)
- end
- end
通过代码,可以一目了然了。
到此为止,我们做完了所有的基础工作,让我们总结一下,为了使用ajax来查看修改字段内容,我们需要经过如下几个步骤:
1.在视图中引入<%= javascript_include_tag :default%>
2.在需要的地方使用in_place_editor_field :class_name,:class_method
3.在controller中使用in_palce_editor_for来自动生成一系列方法
只要三步,ajax就是这么简单。