FCKeditor 在ASP.Net 中的使用說明

FCKeditor 是一個運行在瀏覽器上的 JavaScript 應用程序。他可以不依賴任何服務器端語言運行。不過,更好的使用方法是你使用一種服務器端語言來調用他。

在ASP.Net 中,有一個現成的工具包可以讓你把 FCKeditor 作爲一個WebForms控件使用。這個工具包叫FCKeditor.Net。

要在你的 ASP.Net web 頁面中使用他,請按照以下步驟執行。

前提條件

在進行以下幾步前,你必須已經下載並且安裝了最新版本的FCKeditor編輯器工具包(將他COPY到你的網站)。FCKeditor.Net 工具包並不包含FCKeditor編輯器的代碼。(將編輯器JavaScript代碼放到你網站的/FCKeditor/ 目錄)。你能從下面的地址下載到編輯器: 
http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=75845 

第一步

確保編輯器已經在你網站的 "/FCKeditor/" 目錄裏。現在,你需要下載FCKeditor ASP.Net 控件的DLL文件到你的頁面。你能在下面的地址找到最新的版本: 

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

第二步

在下載的ZIP文件中包含控件的源代碼和一個已經編譯好的文件("bin/Release/FredCK.FCKeditorV2.dll")。大多少情況下,你並不需要對源代碼做任何改變。你僅僅需要在你的項目中引用編譯好的DLL文件,引用有2個方法: 

手動複製FredCK.FCKeditorV2.dll 文件到你網站的"bin"目錄 
在你的Visual Studio.Net項目中按右鍵並選擇“添加引用” ,從你保存FredCK.FCKeditorV2.dll 文件的地方選擇他。 
你也可以直接在Visual Studio.Net工具箱中包含這個控件,在工具箱中右鍵,選擇“添加項”,然後,選擇FredCK.FCKeditorV2.dll 。 
確保你已經有了最新的DLL文件版本。 
第三步

現在就可以在你的網站上使用他了,新建一個ASP.Net頁面,在頁面上創建一個實例,有2個方法: 

把控件從工具箱中拖到你的頁面(如果你已經在“第二步”中把他加到你的工具箱) 
在你的ASP.Net頁面頂部包含以下代碼: 
<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" %>

並且在<FORM runat="server">中添加控件的標籤: 

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

注意: BasePath 屬性所指定的目錄就是FCKeditor 所在的目錄

全部代碼如下

<%@ Page ValidateRequest="false" Language="VB" 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" />

      <br />

      <input type="submit" value="Submit" runat="server" />

    </form>

  </body>

</html>

文件瀏覽和上傳

爲了方便上傳文件和圖片到服務器,FCKeditor擁有文件管理和快速上傳功能。 

FCKeditor的這個功能依賴於服務器端的語言。你只需要爲你使用的那種語言做簡單的設置。爲了在ASP.Net中使用,你要打開FCKeditor目錄中的fckconfig.js 文件,找到_FileBrowserLanguage 和 _QuickUploadLanguage ,並將他們的值設置爲'aspx' 。

你的網站必須有上傳文件的權限,還要預先設置好上傳目錄。默認情況下, FCKeditor.Net 會在網站的根目錄下查找UserFiles 目錄,並把所有文件都放到這裏,所以要先建好這個目錄 。 

注意: 需要給予ASPNET 和/或者 IUSR_<ComputerName> 用戶對UserFile目錄的文件/目錄的寫和創建權限。

示範

你可以在FCKeditor.Net 工具包的"_samples/aspx"目錄中找到一些告訴你如何使用的示範文件。把這個目錄複製到FCKeditor安裝的同一個目錄就可以使用了。 

最小安裝示範

這是一個假設的在ASP.Net網站中使用FCKeditor 的情況 


我們可以看到,這個網站包括: 

FredCK.FCKeditorV2.dll 文件, 從FCKeditor.Net 工具包中複製到網站根目錄中的bin 目錄裏。 (查看 "第一、第二步") 
FCKeditor 目錄,編輯器的JavaScript代碼(來自FCKeditor 工具包). (查看 "前提條件") 
UserFiles 目錄,放置用戶上傳文件的地方 
MyPage.aspx 頁,包含上面演示如何使用編輯器的代碼。 (查看 "第三步") 
小技巧

你可以在web.config 配置文件中設置默認的UserFiles 路徑,這樣,在你網站裏使用的所有FCKeditor 編輯器都可以使用這個設置:

<appSettings>

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

</appSettings>

ASP.Net 1.1 和 2.0

在使用FCKeditor 的頁面,需要把ValidateRequest 屬性爲false: 

<%@ Page Language="VB" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false" ValidateRequest="false" %>

這是因爲由編輯器建立的一些輸入會被.Net Framework認爲有危險。 

ASP.Net 2.0 和主題

如果你正在使用Asp.net 2.0 和主題:你必須打開/editor/filemanager/upload/aspx/upload.aspx 和、/editor/filemanager/browser/default/connectors/aspx/connector.aspx  並且在第一行添加或者修改Theme="" : 

<%@ Page Language="VB" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false" Theme="" %>

在代碼中修改UserFilesPath 

如果你想修改用戶上傳文件的路徑,你並不需要動態加載控件,但你需要在page init 中做一些操作,(並不是在page load 中)。下面是一個例子: 

Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init

   Session("FCKeditor:UserFilesPath") = "~/App_Images/" & _teamName

End Sub

在代碼中動態添加編輯器

把Base path 設置在 web.config 文件中: 

例如,如果下面是FCKeditor 所在目錄"c:/inetpub/wwwroot/virtualdir/FCKeditor/" ,這樣添加: 

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

可以使用session 來設置UserFilesPath 的路徑,需要在你添加控件前設置session 變量。

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

可以使用request 對象來設置BasePath。假設當前路徑是: "http://<host>/FCKEditor/"。 

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

添加控件到頁面:

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)  
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章