漫漫技术人生路

C#

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::
原文地址:http://wiki.fckeditor.net/Developer%27s_Guide/Integration/ASP.Net

http://www.yaosansi.com/blog/article.asp?id=883
http://www.fckeditor.net/support/

It is very easy to use FCKeditor in your ASP.Net web pages. Just follow these steps.

[按着下面的步骤你将会很容易的把FCKeditor运用到ASP.Net的页面中。]

<!--[if !vml]-->/!\<!--[endif]-->You must have downloaded and installed (copied it in your web site) the last version of FCKeditor editor before proceeding with these steps. The FCKeditor.Net package doesn't include the core of the editor (JavaScript scripts to be placed in the /FCKeditor/ directory of your site). You can download it from the following URL:
[在这之前,你必须下载和安装(或复制)FCKeditor的最新版本到你的网站中。FCKeditor.Net程序包并不包含编辑器的核心(JavaScript脚本放置在你的站点中的/FCKeditor/文件夹下面)。你可以从以下网址下载到它:]

[[BR]] http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=75845

 

 

Step 1
[步骤1]

 

 

Suppose that the editor is installed in the /FCKeditor/ path of your web site. Now you need to download the FCKeditor ASP.Net Control DLL to use in your pages. You can find the last version here:
[假如编辑器的安装路径是在你站点的/FCKeditor/目录下。你还需要下载FCKeditor ASP.Net Control DLL以致能运用到你的网页中去。在这里可以下载到最新的版本:]

 

 

http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=137125

 

 

Step 2
[步骤2]

 

 

The downloaded ZIP file contains the original source code of the control and a compiled version (in the "bin" directory"). So now, just create a reference to the compiled version. You have two options to do that:
[在你下载的ZIP压缩包里面包含有源代码和一个编译过的版本(在“bin”文件夹中)。现在,你就可以用以下两种方法来创建编译版本的引用了:]

 

 

  • Right-clicking in "References" in your Visual Studio.Net project.
    [在你的Visual Studio.Net项目中鼠标右击"References"]

     

  • Manually copying the DLL to the "bin" directory of your web site.
    [手动把DLL文件复制到你站点下的“bin”目录下。]

     

You can include the control in your Visual Studio.Net controls toolbox. Just right-click on it and select "Add/Remove Items...". Then, just point to the downloaded DLL.
[只要在Visual Studio.Net工具箱中右击选择"Add/Remove Items...",选择刚才下载的DLL文件,就可以把它添加到工具箱中。]

 

 

Step 3
[步骤3]

 

 

Now the editor is ready to be used in your site, so just create a ASP.Net page and, to create an instance of the editor, you have two options:
[现在就可以把编辑器运用到你的站点中去,你有如下两种方法创建一个包含有编辑器的实例ASP.Net页面:]

 

 

  • Just drag and drop the control in your page from the toolbox (if you have added it to the toolbox as described at "Step 2").
    [把它从工具箱中拖拉出来(如果你如“步骤2所说的那样把它加到工具箱的话)]

     

  • Include the following line in the top of your ASP.Net page source:
    [先把下面代码加到ASP.Net代码的顶端:]

     

<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" %>

 

 

And then adding the editor tag inside a <FORM runat="server">:
[然后在添加编辑器时包含标记<FORM runat="server">]

 

 

<FCKeditorV2:FCKeditor id="FCKeditor1" runat="server"></FCKeditorV2:FCKeditor>

 

 

The complete sample
[完整的例子]

 

 

<%@ Page ValidateRequest="false" Language="C#" AutoEventWireup="false" %>
<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" %>
<html>
  <head>
    <title>FCKeditor - Sample</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  </head>
  <body>
    <form runat="server">
      <FCKeditorV2:FCKeditor id="FCKeditor1" runat="server"></FCKeditorV2:FCKeditor>
      <br>
      <input type="submit" value="Submit" runat="server">
    </form>
  </body>
</html>

 

 

Samples
[示例]

 

 

You can find some samples on how to use the editor in the "_samples/aspx" directory of the FCKeditor.Net distribution package. To install the samples, just copy that directory to the _samples directory found in the FCKeditor core package installation.
[FCKeditor.Net发行包中的“_samples/aspx”目录下,你能够找到一些如何使用编辑器的示例。如果要安装这些示例,只要从FCKeditor安装包中复制_samples文件夹过来就可以了。]

 

 

Properties
[属性]

 

 

The following properties are exposed by the ASP.NET server control.
[以下是可由ASP.NET服务器控制的属性。]

 

 

AutoDetectLanguage
BaseHref
BasePath
ContentLangDirection
CustomConfigurationsPath
Debug
DefaultLanguage
EditorAreaCSS
EnableSourceXHTML
EnableViewState
EnableXHTML
FillEmptyBlocks
FontColors
FontFormats
FontNames
FontSizes
ForcePasteAsPlainText
ForceSimpleAmpersand
FormatIndentator
FormatOutput
FormatSource
FullPage
GeckoUseSPAN
Height
ID
ImageBrowserURL
LinkBrowserURL
PluginsPath
runat
SkinPath
StartupFocus
StylesXMLPath
TabSpaces
ToolbarCanCollapse
ToolbarSet
ToolbarStartExpanded
UseBROnCarriageReturn
Value
Visible
Width

 

 

The following events are raised by the ASP.NET server control.
[以下是可由ASP.NET服务器控制的属性。]

 

 

OnDataBinding
OnDisposed
OnInit
OnLoad
OnPreRender
OnUnload

 

 

Special note if you are using Asp.net 2.0 and themes: you must open up \editor\filemanager\upload\aspx\upload.aspx and editor\filemanager\browser\default\connectors\aspx\connector.aspx and modify the first line to add Theme="" as follows: <%@ Page language="c#" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false" Theme="" %>
[如果你使用Asp.net 2.0和主题,要特别注意:你必须展开\editor\filemanager\upload\aspx\upload.aspxeditor\filemanager\browser\default\connectors\aspx\connector.aspx,就像这样在第一行上加Theme=""<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false" Theme="" %>]

 

 

You can set the default UserFiles path in your web.config file:
[你能够在web.config文件中设置默认的UserFiles路径:]

 

 

<appSettings>
   <add key="FCKeditor:UserFilesPath" value="/Wherever/Files" />
</appSettings>

 

 

Changing the UserFilesPath to be dynamic
[动态改变UserFilesPath]

 

 

Suppose you would like to modify the location of user uploaded files. You can do so without dynamically adding the control, but you should do so in the page init, not the page load. For example, here is an example which uses files for each team in the same directory:
[假如你想修改用户上传文件的位置。那么可以不用动态添加控件,但你要在页面初始化时修改,而不是在页面装载的时候。例如,在下面的例子中,每个组的用户文件都在一个文件夹中:]

 

 

Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
   Session("FCKeditor:UserFilesPath") = "~/App_Images/" & _teamName
End Sub

 

 

add an editor Dynamically in your code
[动态添加编辑器到你的代码中]

 

 

if you use an application method (virtual directory), then set the Base path in the web.config file:
[如果你使用应用程序的方法(虚拟目录),那么要在web.config文件中设置Base路径:]

 

 

For example if this is your FCKeditor path "c:/inetpub/wwwroot/virtualdir/FCKeditor/"
[例如如果这是FCKeditor路径"c:/inetpub/wwwroot/virtualdir/FCKeditor/"]

 

 

add this:
[那么加上:]

 

 

<add key="FCKeditor:BasePath" value="~/FCKeditor/"></add>

 

 

I use a session to set the filebrowsers path, Add the session variable before you make the control
[如果用事务设置filebrowsers路径,那么要在使用控件前加上事务的变量]

 

 

Session("FCKeditor:UserFilesPath") = "/virtualdir/userfiles/"

 

 

Add the control to the page:
[在页面中添加控件:]

 

 

            Dim fckeditor As New FredCK.FCKeditorV2.FCKeditor
            fckeditor.ImageBrowserURL = "http://localhost/virtualdir/FCKeditor/editor/filemanager/browser/default/browser.html?Type=Image&Connector=connectors/aspx/connector.aspx"
            fckeditor.ID = "dynamicname"
            fckeditor.Value = "the text you want in the FCK editor"
            fckeditor.SkinPath = "skins/silver/"
            fckeditor.ToolbarSet = "Default"
            myForm.Controls.Add(fckeditor)

ASP.Net Integration

FCKeditor is a JavaScript application that runs in the browser. You can use it without any kind of strict server side integration, if you want. But, a more clean and powerful way to use it, is by choosing a server side integration package that fit your needs.

For ASP.Net, a parallel package is available to make it possible to use FCKeditor as any other control on WebForms. This package is called FCKeditor.Net.

It is very easy to use FCKeditor in your ASP.Net web pages. Just follow these steps.

Prerequisites

/!\ You must have downloaded and installed (copied it in your web site) the latest version of FCKeditor editor before proceeding with these steps. The FCKeditor.Net package doesn't include the core of the editor (JavaScript scripts to be placed in the /FCKeditor/ directory of your site). You can download it from the following URL:
http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=75845

Step 1

Suppose that the editor is installed in the "/FCKeditor/" path of your web site. Now you need to download the FCKeditor ASP.Net Control DLL to use in your pages. You can find the last version here:

http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=137125

Step 2

The downloaded ZIP file contains the original source code of the control and a compiled version of it (the "bin/Release/FredCK.FCKeditorV2.dll" file"). You most probably will not need to make changes in the source, so just consider the compiled DLL file, and just create a reference to it in your project. You have two options to do that:

  • Manually copying the FredCK.FCKeditorV2.dll file to the "bin" directory of your web site.
  • Right-clicking in "References" in your Visual Studio.Net project and select the FredCK.FCKeditorV2.dll file from the directory you have saved it.
  • You can include the control in your Visual Studio.Net controls toolbox. Just right-click on it and select "Add/Remove Items...". Then, just point to the FredCK.FCKeditorV2.dll file.
  • Make sure that you have the latest version of the dll. It may be worthwhile to recompile from the source if you are having issues getting the upload and connector features to work.

Step 3

Now the editor is ready to be used in your site, so just create a ASP.Net page and, to create an instance of the editor, you have two options:

  • Just drag and drop the control in your page from the toolbox (if you have added it to the toolbox as described at "Step 2").
  • Include the following line in the top of your ASP.Net page source:

<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" %>

And then adding the editor tag inside a <FORM runat="server">:

<FCKeditorV2:FCKeditor id="FCKeditor1" BasePath="/FCKeditor/" runat="server"></FCKeditorV2:FCKeditor>

/!\ Note that the BasePath property points to the directory where the FCKeditor scripts have been copied.

The complete sample

<%@ Page ValidateRequest="false" Language="C#" AutoEventWireup="false" %>
<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" %>
<html>
  <head>
    <title>FCKeditor - Sample</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  </head>
  <body>
    <form runat="server">
      <FCKeditorV2:FCKeditor id="FCKeditor1" BasePath="/FCKeditor/" runat="server"></FCKeditorV2:FCKeditor>
      <br>
      <input type="submit" value="Submit" runat="server">
    </form>
  </body>
</html>

File Browser and Quick Upload

FCKeditor comes with a default File Browser that makes it easy to user to upload files and images to the server, as well as browse the available files for reuse. It is also available a "Quick Upload" feature to quickly upload files and create links for them.

This default system is integrated with all server side languages supported by FCKeditor. You just need to make a simple configuration to indicate which one you are using. To do that for ASP.Net, just open the fckconfig.js file in the directory where you have copied the FCKeditor core package. Look for the _FileBrowserLanguage and _QuickUploadLanguage entries and set their values to 'aspx' .

You must prepare your site to accept the uploaded files and their relative directory. structure. By default FCKeditor.Net will look for the UserFiles directory in the root of the web site, and place all files there. So, just create that directory.

/!\ Important: You must grant the necessary privileges to the ASPNET and/or IUSR_<ComputerName> users to be able to write files and create directories in the UserFiles directory.

Samples

You can find some samples on how to use the editor in the "_samples/aspx" directory of the FCKeditor.Net distribution package. To install the samples, just copy that directory to the _samples directory found in the FCKeditor core package installation.

Minimum Installation Sample

This is a fictitious structure of a ASP.Net web site using FCKeditor.

As we can see, this site is composed by:

  • The FredCK.FCKeditorV2.dll file, which has been downloaded from the FCKeditor.Net package and simply copied to the bin directory in the web site root. (See "Steps 1 and 2")

  • The FCKeditor directory, where the editor scripts have been copied (from the FCKeditor core package). (See "Prerequisites")

  • The UserFiles directory, where user uploaded files will be placed.

  • A simple MyPage.aspx page that uses the editor, with the above sample code on it. (See "Step 3")

Tips

You can set the default UserFiles path in your web.config file, so it will be set to all FCKeditor instances you use in your web site:

<appSettings>
   <add key="FCKeditor:UserFilesPath" value="/Wherever/Directory/" />
</appSettings>

ASP.Net 1.1 and 2.0

On the pages where FCKeditor has to be included, it's recommended to set the ValidateRequest property of the Page directive to false:

<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false" ValidateRequest="false" %>

This is because some input created by the editor may be considered dangerous by the .Net Framework.

ASP.Net 2.0 and Themes

Special note if you are using Asp.net 2.0 and themes: you must open up \editor\filemanager\upload\aspx\upload.aspx and editor\filemanager\browser\default\connectors\aspx\connector.aspx and modify the first line to add Theme="" as follows:

<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false" Theme="" %>

Changing the UserFilesPath by code

Suppose you would like to modify the location of user uploaded files. You can do so without dynamically adding the control, but you should do so in the page init, not the page load. For example, here is an example which uses files for each team in the same directory:

Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
   Session("FCKeditor:UserFilesPath") = "~/App_Images/" & _teamName
End Sub

Add an editor Dynamically in your code

if you use an application method (virtual directory), then set the Base path in the web.config file:

For example if this is your FCKeditor path "c:/inetpub/wwwroot/virtualdir/FCKeditor/"

add this:

<add key="FCKeditor:BasePath" value="~/FCKeditor/"></add>

I use a session to set the filebrowsers path, Add the session variable before you make the control

Session("FCKeditor:UserFilesPath") = "/virtualdir/userfiles/"

I use the request object in order to establish the correct BasePath. I suppose that the correct path is on "http://<host>/FCKEditor/".

FCKeditor1.BasePath = Request.ApplicationPath + "/FCKEditor/";

Add the control to the page:

Dim fckeditor As New FredCK.FCKeditorV2.FCKeditor
fckeditor.ImageBrowserURL = "http://localhost/virtualdir/FCKeditor/editor/filemanager/browser/default/browser.html?Type=Image&Connector=connectors/aspx/connector.aspx"
fckeditor.ID = "dynamicname"
fckeditor.Value = "the text you want in the FCK editor"
fckeditor.SkinPath = "skins/silver/"
fckeditor.ToolbarSet = "Default"
myForm.Controls.Add(fckeditor)

Developer's Guide/Integration/ASP.Net

posted on 2006-09-30 12:38  javaca88  阅读(1181)  评论(0编辑  收藏  举报