`
cjyzpcl
  • 浏览: 33934 次
  • 性别: Icon_minigender_1
  • 来自: Charlotte
社区版块
存档分类
最新评论

JS-RichEdit与Rails的整合

阅读更多
原因:自己做一个RichEdit耗费的时间较多,而且项目时间比较赶,所以选择了一个较为便宜的RichEdit插件使用。

     JS-RichEdit 主页http://www.gerd-tentler.de/tools/richedit/

     使用前请注意下Usage Policy:

    This software is freeware for non-commercial use. If you like it, please feel free to make a donation! However, if you intend to use it in a commercial project / website, please donate at least €20. Thank you! :-) 
    Also please note that this software is not open source, i.e. you are allowed to make modifications for your own personal use, but you may not distribute the original or the modified code without permission. If you change the code, there should be no modification of the copyright message. You should, however, add a message below the copyright message and list your modifications there.

    我下个星期会对Js-RichEdit做中文化处理,到时候会对如何做中文化处理进行简单的说明。由于Policy,我没有权力公开传播修改过后的js文件,请见谅。

    下载richedit.zip文件,解压在rails的public/javascripts目录下。打开richedit.js文件,找到这两行: 这样可以保证richedit找到内置的icon图片。

js 代码
  1. this.iconPath = "icons";                      // path to icons   
  2. this.bulletpoint = "bp.gif";                  // bullet point image (full path)  

    修改为:

js 代码
  1. this.iconPath = "/javascripts/icons";                      // path to icons   
  2. this.bulletpoint = "/javascripts/bp.gif";                  // bullet point image (full path)  

    使用方法如下,在里面引入js source(作者推荐的),Rails里面是这样:

java 代码
  1. <%= submit_tag "发表回复", :onClick => "rtoStore()" %>  

    再需要使用的地方,加入如下代码:

js 代码
  1. var editor = new EDITOR();   
  2. editor.setFocus = true;                                                           
  3. editor.create("<!---->");  

  上面的代码是将@group对象中的board_information属性放入richeditor中。

  需要注意的是必须对\r 或者 \n 进行转换,因为如果文本中出现\r或者\n会出现javascript错误。

  原文如下:

  Please note that your content may not include any CR or NL characters, or else you will get a JavaScript error.

  在表单提交代码中加入:

java 代码

 

  1. <%= javascript_include_tag "richedit" %>  

   这样提交的时候就会执行rtoStore方法,然后我们就可以通过params[:richEdit0]来访问RichEditor内容,将其赋予Model相应属性即可使用。现在的版本没有支持中文化处理。但实际上中文化也是很简单的,下周我会抽空对JS-RichEdit进行全面的中文化。 

  • 描述: 效果图
  • 大小: 9 KB
分享到:
评论
1 楼 cjyzpcl 2007-07-30  
javaeye的编辑器好象有点问题,上面替换\r\n的代码如下:
@group.board_information.gsub(/\r|\R|\n|\N/, "")

相关推荐

Global site tag (gtag.js) - Google Analytics