LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

FCKeditor.Net_2.6.3(在线编辑器)的配置方法-NET编程

Ccoffee
2012年2月29日 10:38 本文热度 2903

之前用的在线编辑器是DotNetTextBox ,并且曾一度觉得它异常强大,如可以给上传的图片加文字水印或者图片水印,但后来发现其上传的图片不容易管理,都挤在一个文件夹里面(免费版,付费版好像可以分文件夹上传保存图片),并且段首空格总不是所见即所得,我编辑时空了两个字符的位置,到了前台页面的时候只有一个字符,所以今天我再找了一款.Net的在线编辑器,技术群的黄昏推荐了FCKeditor,百度了一下,评价还不错,而且开源,于是到其官网下载了最新的版本FCKeditor_2.6.3。这里需要注意一下,单下载FCKeditor_2.6.3.zip并不能应用.Net环境,还需要下载另外一个文件FCKeditor.Net_2.6.3.zip。官网下载地址:http://www.fckeditor.net/


   下面讲讲FCKeditor.Net编辑器在.net环境的配置方法。


   第一步:解压缩FCKeditor_2.6.3.zip文件,并将解压缩得到的fckeditor文件夹复制到你想使用这个编辑器的网站的根目录下面。


   第二步:把下载的FCKeditor.Net.zip随便解压缩到你硬盘的一个空目录,里面是FCKeditor.Net的源代码,可以对它进行再度开发,我这里讲直接应用,我们要使用到是其目录下的\bin\Debug目录中的FredCK.FCKeditorV2.dll文件。在你的网站里面把这个FredCK.FCKeditorV2.dll添加到bin目录下。


   第三步:进入FCKeditor文件夹,编辑 fckconfig.js 文件,如下:


 


1、指定编辑器应用的编程环境,修改
var _FileBrowserLanguage = 'asp' ; // asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'asp' ; // asp | aspx | cfm | lasso | php
改为
var _FileBrowserLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'aspx' ; // asp | aspx | cfm | lasso | php



2、配置语言包。有英文、繁体中文等,这里我们使用简体中文。
修改
FCKConfig.DefaultLanguage = 'en' ;

FCKConfig.DefaultLanguage = 'zh-cn' ;



3、配置皮肤。有default、office2003、silver风格等,这里我们可以使用默认。
FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;
4、在编辑器域内可以使用Tab键。(1为是,0为否)
FCKConfig.TabSpaces = 0 ; 改为FCKConfig.TabSpaces = 1 ;



5、加上几种我们常用的字体的方法,例如:
修改
FCKConfig.FontNames = 'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;

FCKConfig.FontNames = '宋体;黑体;隶书;楷体_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana'



6、编辑器域内默认的显示字体为14px,想要修改可以通过修改样式表来达到要求,打开/editor/css/fck_editorarea.css,修改font-size属性即可。如



7、关于安全性。
如果你的编辑器用在网站前台的话,那就不得不考虑安全了,在前台千万不要使用Default的toolbar,要么自定义一下功能,要么就用系统已经定义好的Basic,也就是基本的toolbar,
修改
FCKConfig.ToolbarSets["Basic"] = [
    ['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink','-','About']

FCKConfig.ToolbarSets["Basic"] = [
['Bold','Italic','-','OrderedList','UnorderedList','-','Unlink','-','Style','FontSize','TextColor','BGColor','-','Smiley','SpecialChar','Replace','Preview']
] ;
   第四步:在Web.Config文件里面添加,如下所示


1、配置WebConfig,在<appSettings>节点添加,如下所示:
如果你用的是默认的上传功能,则
    <add key="FCKeditor:BasePath" value="~/fckeditor/"/>
    <add key="FCKeditor:UserFilesPath" value="/网站名称/UploadFiles/"/>
第五步:在页面里应用FCKeditor编辑器


<%@ Page Language="C#" AutoEventWireup="true"   CodeFile="Default.aspx.cs" Inherits="_Default" validateRequest="false" %>


<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
// 这里要主要两个参数
// 默认为<%@ Page Language="C#" AutoEventWireup="true"   CodeFile="Default.aspx.cs" Inherits="_Default" %>
// 我们要添加一个参数 validateRequest=false,否则提交带html代码的内容会报错
// 从客户端(...)中检测到有潜在危险的 Request.Form 值。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server">
        </FCKeditorV2:FCKeditor>
        &nbsp;</div>
    </form>
</body>
</html>
如何获取其内容呢?读取FCKeditor1控件的Value属性值即可。


到这里基本OK了,但是我发现在使用图片上传功能的时候,会弹出一个阻止框,显示"this connector is disabled Please check the"editor/filemanager/connectors/aspx/config.aspx",解决这个错误的方法是打开editor/filemanager/connectors/aspx/config.ascx修改CheckAuthentication()方法,返回true


C# code


private bool CheckAuthentication()
{
// WARNING : DO NOT simply return "true". By doing so, you are allowing
// "anyone" to upload and list the files in your server. You must implement
// some kind of session validation here. Even something very simple as...
//
//        return ( Session[ "IsAuthorized" ] != null && (bool)Session[ "IsAuthorized" ] == true );
//
// ... where Session[ "IsAuthorized" ] is set to "true" as soon as the
// user logs in your system.


        return true;
}


 



下载地址:http://www.fckeditor.net/download


FCKeditor使用


一、配置 
1、在www.fckeditor.net点击Download,下载FCKEditor_2.5.1.zip和FCKEditor.Net(ASP.NET Control to easily integrate FCKEditor on .Net Web pages.)


2、新建一项目,比如叫FCK。解压FCKEditor_2.5.1.zip,里面有个fckeditor目录。把该目录整个复制到新建的ASP.NET项目根目录下。打开fckeditor目录下的fckconfig.js,修改二项: 
FCKConfig.DefaultLanguage = 'en' ; 
改为 
FCKConfig.DefaultLanguage = 'zh-cn' ; 
----------------------------------------------------- 
var _FileBrowserLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py 
var _QuickUploadLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py 
改为 
var _FileBrowserLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py 
var _QuickUploadLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py


3、在vs05/08的工具箱上新建一个名叫FCKEditor的Tab,然后在里面点右键,选择Choose Item,定位到解压FCKEditor.Net后生成的FCKEditor2.51\FCKeditor.Net_2.5\bin\Release\2.0目录下的FredCK.FCKEditorV2.dll。该Tab下就会生成一个FCKEditor的.net组件。在vs的Design模式下把该组件拖放到界面上。点击该组件,在属性面板上设置BashPath为/FCK/fckeditor/,注意这里的FCK就是你建的ASP.NET的项目名称,fckeditor为项目根目录下的目录名称。(注意:/FCK/fckeditor/前后的斜杠,少了一个都不会显示编辑器的)。Ctrl+F5!


其它次要配置(不影响使用): 
* 可以把fckeditor目录及其子目录下所有下划下开头的范例、源文件删掉。 
* 可以在fckeditor目录下只保留fckconfig.js、fckeditor.js和几个xml文件,其余全部删掉。 
* fckeditor目录下的editor目录下有个filemanager目录,把该目录下的borswer\default\connectors目录中除aspx目录以外的全部目录删掉。 
* 可以把editor\lang目录下除zh-cn.js、en.js、zh.js之外的全部删掉。


二、图片上传 
FCKEditor支持图片上传。可以在ASP.NET项目根目录下添加一目录,起名为UploadFiles. 
在web.config里的appSettings段里 
<appSettings> 
    <add key="FCKEditor:BasePath" value="/FCK/fckeditor"/> 
    <add key="FCKeditor:UserFilesPath" value="/FCK/UploadFiles/" /> 
</appSettings>


注意UserFielsPath,这里设置的/FCK/UploadFiles/指定了要上传的目录。个人认为这里的FCK可以认为是服务器上的虚拟目录名。(另外发现如设为时不起作用)。


当上传图片时有可能遇到"this connector is disabled Please check the"editor/filemanager/connectors/aspx/config.aspx"的错误,这时可以更改fckeditor\editor\filemanager\connectors\aspx\config.ascx的CheckAuthentication()方法,返回true.


三、简单的FCKEditor存取数据库及显示 
1、在项目里添加新项Sql Server Database, 文件名保留为Database.mdf。在里面新建一表MyTable,只有两个字段,一个int型自动增加的primary key, 另一个是text类型的MyContent. 我们要把FCKEditor1.Value值存到这个字段里。


2、先做个显示的页面。项目增加一个Show.aspx,拖一个SqlDataSource,设置一下返回MyTable的内容。再用Repeater显示。


//代码


<asp:Repeater ID="myRepeater" runat="server" DataSourceID="SqlDataSource1"> 
            <HeaderTemplate> 
                <table> 
            </HeaderTemplate> 
            <ItemTemplate> 
                <tr> 
                    <td> 
                       <%# Eval("MyContent") %> 
                    </td> 
                </tr> 
            </ItemTemplate> 
            <FooterTemplate> 
                </table> 
            </FooterTemplate> 
        </asp:Repeater> 
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
        ConnectionString="<%nbsp;ConnectionStrings:ConnectionString %>" 
        SelectCommand="SELECT [OID], [MyContent] FROM [MyTable] ORDER BY [OID] DESC"></asp:SqlDataSource>


3、存入数据库 
项目中引用System.Configuration(为了使用System.Web.WebConfigurationManager) 
在FCKEditor界面上入一个按钮,然后 
protected void Button1_Click(object sender, EventArgs e) 
{ 
using (SqlConnection conn = new SqlConnection()) 
{ 
conn.ConnectionString = System.Web.Configuration.WebConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString; 
SqlCommand cmd = new SqlCommand(); 
cmd.Connection = conn; 
cmd.CommandText = "insert into MyTable(MyContent) values(@FCKContent)"; 
cmd.Parameters.AddWithValue("FCKContent",FCKeditor1.Value); 
conn.Open(); 
cmd.ExecuteNonQuery(); 
} 
}


该文章在 2012/2/29 10:38:31 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2024 ClickSun All Rights Reserved