KindEditor使用初步
出处:http://www.cnblogs.com/zhouhb/p/3430913.html
KindEditor是一套开源的HTML可视化编辑器,非常适合在CMS、商城、论坛、博客、Wiki、电子邮件等互联网应用上使用,目前在国内已经成为最受欢迎的编辑器之一。目前最新版本为4.1.9,详见http://www.kindsoft.net/。
基本使用步骤:
1、下载后解压缩,把js文件以及lang、plugins、themes文件夹拷贝到自己的网站目录下,如拷贝到网站的editor目录下。
2、为了实现文件上传,在网站中新建handler目录,放置file_manager_json.ashx及upload_json.ashx(这2个文件在KindEditor解压缩后的asp.net文件夹下)。
3、为网站引用LitJSON.dll,这个文件在KindEditor解压缩后的asp.net\bin文件夹下。
4、在网站中新建upload目录,用来接收上传的文件。
4、修改file_manager_json.ashx,只要改下面的2行,即把文件接收路径改成自己的upload目录:
//根目录路径,相对路径
String rootPath = "../upload/";
//根目录URL,可以指定绝对路径,比如 http://www.yoursite.com/attached/
String rootUrl = aspxUrl + "../upload/";
5、同理,修改upload_json.ashx,只要改下面的2行,即把文件接收路径改成自己的upload目录:
//文件保存目录路径
String savePath = "../upload/";
//文件保存目录URL
String saveUrl = aspxUrl + "../upload/";
6、修改web.config,添加requestValidationMode="2.0",即
<system.web>
<compilation debug="true" targetFramework="4.0"/>
<httpRuntime maxRequestLength="204800" executionTimeout="3600" requestValidationMode="2.0"/>
</system.web>
同时,在要使用KinderEditor的aspx页面上添加ValidateRequest="false",即
<%@ Page Language="C#" AutoEventWireup="true" ValidateRequest="false" CodeFile="UseKindEditor.aspx.cs" Inherits="UseKindEditor" %>
7、在页面上添加代码:
<script charset="utf-8" src="editor/kindeditor.js"></script>
<script charset="utf-8" src="editor/lang/zh_CN.js"></script>
<script>
KindEditor.ready(function (K) {
K.create('#editor_id', {
uploadJson: 'handler/upload_json.ashx',
fileManagerJson: 'handler/file_manager_json.ashx',
allowFileManager: true
});
});
</script>
<asp:TextBox ID="editor_id" TextMode="MultiLine" runat="server" Height="338px"
Width="776px"></asp:TextBox>
K.create语句中的#editor_id'为文本框控件的ID,要对应好。handler目录为第2步中新建的,用来放置file_manager_json.ashx及upload_json.ashx。
8、添加保存按钮的事件处理代码:
//获取编辑器中的内容
string content = editor_id.Text;
string sql = "insert into news(content) values('" + content + "')";
//插入到数据库中
AccessDAL.OleDbHelper.ExecuteNonQuery(sql);
string sql2 = "select id from news order by id desc";
int id = (int)AccessDAL.OleDbHelper.ExecuteScalar(sql2);
Response.Redirect("ShowNews.aspx?id=" + id);//显示刚才录入的内容
9、如果要配置上传文件的大小,需修改upload_json.ashx中的int maxSize = 1000000;此处是以Byte作为单位的;另外,要修改web.config,配置asp.net本身允许的上传文件的大小,如
<system.web>
<compilation debug="true" targetFramework="4.0"/>
<httpRuntime maxRequestLength="204800" executionTimeout="3600" requestValidationMode="2.0"/>
</system.web>
此处是以KB作为单位的。