Integrating FCKEditor(FCK与ROR结合应用)

FCKEditor是一个带有丰富功能的文本编辑器(text box),它和其他编辑器不同的在于它工作在Browser。它是一个开源项目,编写语言是javascript
下面介绍它是如何RoR一同工作的,可以在 http://www.fckeditor.net 下载到它的最新版本,我们先把下载文件中的:
/editor/
fckconfig.js
fckeditor.js
fckstyles.xml
fcktemplates.xml
拷贝到RoR architecture的javascript文件夹下
(public文件夹下建一个fckeditor文件夹,把上面所有文件放到fckeditor内,同时把除/editor/文件夹外的其它四个文件放到public/javascripts下面)
在需要FCKEditor的文件夹下面加入代码:
<%= javascript_include_tag "fckeditor" %>
<script type="text/javascript">
window.onload = function()
{
var oFCKeditor = new FCKeditor( 'product_intro' ) ;
oFCKeditor.ReplaceTextarea() ;
}
</script>
用户载入有关js文件,并且触发onload事件,这个事件会重置textarea
因此我们要加上:
<form action="/user/article" method="POST">
<TR bgColor=#ffffff><TD height=16 colspan="3">
<textarea id="MyTextarea" name="MyTextarea">This is <b>the</b> initial value.</textarea>
<input type="submit" value="提交文章">
</TD></TR></form>
运行结果就是:
使用起来上面的东西还算是有点麻烦,因为我们要先触发onload事件,然后写一个textarea,我们来增加一个helper method来提高我们的效率
在ApplicationHelper Module中加入method:
def fckeditor_text_field(object, method, options = {})
    text_area(object, method, options ) +
    javascript_tag( "var oFCKeditor = new FCKeditor('" + object + "_" + method + "');oFCKeditor.ReplaceTextarea()" )
end
这样我们就有了一个很好用的method,fckeditior_text_field,我们来使用它:
<%= javascript_include_tag "fckeditor" %>
<%= fckeditor_text_field "MyTextarea", "MyTextarea" %>
<%= submit_tag "提交文章" %>
就3句话,我们达到了同样的效果,很方便,这里我们设定的fckeditor_text_field 这个helper method,前两个arguments表示 text_area helper method 中的前两个arguments,用于表示<textarea>标签中的name属性的值,比如<%=fckeditor_text_field “a”,”b” %> 结果产生name=a[b]样式的<textarea>标签。这里说到了fckeditor_text_field helper method可以产生个textarea,因此我们就可以用处理textarea的方式来处理FCKEditor,比如:
def save
      page = Page.new(params[:a])
      page.save
end
这里保存的将是html格式的文本,在FCKEditor,我们选“源代码”按钮,结果就得到了我们保存的内容,也就是html格式的文本。



文章引用自: http://www.i170.com/user/killercat/Article_36350

你可能感兴趣的:(JavaScript,xml,工作,.net,fckeditor)