用户登录   新用户注册
主题: 分享可供rails3使用的gem，带图片上传浏览，附件上传功能
作者: Macrow, 发布日期: 2011-06-05 09:27:57, 浏览数: 8210

一直找js的在线编辑器，发现kindeditor非常不错，特别符合国人习惯，但上传功能需要自己做，

所以参考论坛php，asp实现方法，做了一个rails使用的gem，带图片上传、浏览和附件上传功能，

源代码我放在Github上了，有时间我会继续完善的，下面贴个简要说明：

 

https://github.com/Macrow/rails_kindeditor

 

 

安装使用需要以下步骤：

  1. gem install rails_kindeditor

  2. rails generate rails_kindeditor:install
  3. rails generate rails_kindeditor:migration
  4. rake db:migrate
  5. gem "carrierwave", "~> 0.5.4" (in your Gemfile)
  6. gem "rails_kindeditor" (in your Gemfile)
   

使用：

  1. 在layout里面包含<%= include_kindeditor %>
  2. 只需要指定textarea的编辑器id即可
作者: Roddy, 发布日期: 2011-06-05 10:17:49
这个一定要支持，rails果然很简洁，几行代码就搞定。
回复
作者: 无语阶段, 发布日期: 2011-06-09 14:09:32

看不太明白，具体说下    
回复
作者: Macrow, 发布日期: 2011-06-12 12:34:07

今天花了点时间做了更新 现在版本为v0.0.2

 

安装使用需要以下步骤：

  1. gem install rails_kindeditor（安装gem）

  2. rails generate rails_kindeditor:install（将kindeditor相关文件拷贝到你的应用里）
  3. rails generate rails_kindeditor:migration（为上传图片、附件添加migration）
  4. rake db:migrate（更新数据库）
  5. gem "carrierwave", "~> 0.5.4" (将此行代码加入到你的Gemfile里)
  6. gem "rails_kindeditor" (将此行代码加入到你的Gemfile里)
   

使用：

  1. 在layout里面包含
    <%= include_kindeditor_if_needed %>
  2. 在controller里使用
    include_kindeditor
    或者 include_kindeditor :only => [:new, :edit] （根据需要确定）
    或者 include_kindeditor :except => [:index, :show, :destroy, :create]（根据需要确定）
  3. 只需要指定textarea的编辑器id即可
    :id => "kindeditor_id"
  4. 你可以配置kindeditor，编辑下面的文件即可
    public/javascripts/kindeditor/kindeditor-init.js
回复
作者: Macrow, 发布日期: 2011-08-19 21:19:34
感谢使用和支持！

目前已将Kindeditor更新到4.x，Gem做了全面改写，现在支持文件上传和完整浏览，欢迎捉虫Bugs.


项目地址：

https://github.com/Macrow/rails_kindeditor


Kindeditor(4.x) for Rails3 中文文档

可供Rails3使用的gem, 包括了图片和附件上传功能，文件按照类型、日期进行存储。上传采用了Carrierwave。

安装

将下面代码加入Gemfile： 

gem "carrierwave"
gem "rails_kindeditor"

运行“bundle”命令： 

bundle

安装Kindeditor，运行下面的代码： 

rails generate rails_kindeditor:install

完毕！默认情况下，rails_kindeditor在上传文件时不会把文件信息记录入数据库。

使用

在你的layout文件中的<head></head>内包含下面代码： 

<%= include_kindeditor_if_needed %>

在你需要使用的controller里面，包含下面代码来控制加载javascript: 

include_kindeditor

把需要转换的textarea赋予下列id值： 

:id => "kindeditor_id"

完毕！

将上传文件信息记录入数据库（可选）

rails_kindeditor 可以将上传文件信息记录入数据库，以便扩展应用.

运行下面的代码，有两项选项：1.active_record 2.mongoid，默认是active_record。 

rails generate rails_kindeditor:migration
or
rails generate rails_kindeditor:migration -o mongoid

运行下面的代码： 

rake db:migrate

完毕！

配置选项

当你使用include_kindeditor_if_needed时，你可以像下面一样设置:lang和:cache： 

<%= include_kindeditor_if_needed :lang => :en %>
<%= include_kindeditor_if_needed :lang => :zh_CN %>
<%= include_kindeditor_if_needed :cache => true %>
<%= include_kindeditor_if_needed :cache => "my-cache-name"  %>
<%= include_kindeditor_if_needed :lang => :zh_CN, :cache => true %>

你可以有选择性地加载kindeditor的javascript： 

include_kindeditor :only => [:new, :edit]
include_kindeditor :except => [:index, :show, :destroy, :create]

你可以通过修改rails_kindeditor-init.js来配置kindeditor，详细配置方法可以阅读Kindeditor的文档: 

public/javascripts/kindeditor/kindeditor-init.js

License

MIT License. Copyright 2011


回复
作者: xuelz, 发布日期: 2011-12-22 16:19:48

你好，我在使用你的方法时，在ie8下面，显示网页上有错误，点击左下角的错误提示，出现“0.sytle为空或不是对象”，kindeditor-min.js 155行。请问这是怎么回事啊，在chrome和firefox下没有错误提示，这个错误提示不影响正常使用。

回复
作者: Macrow, 发布日期: 2012-01-03 00:25:23

制作这个Gem的时候，我对kindeditor的代码没作任何的改动，是直接调用，所以这个kindeditor-min.js我也是用的官方的.


如果提示错误，你可以找到错误的部分，问问官方看看。

回复
发表新帖 发表回复