Fckeditor與ASPNet整合
 

我所寫的小程式

 網路上的軟體工具

 資料庫相關

 影像處理集

    Fake Model

 一些跟我有關的連結

 原文網址 : http://wiki.fckeditor.net/Developer%27s_Guide/Integration/ASP.Net

在你的ASP.Net網頁中使用FCKeditor很簡單,只要照著下面這些步驟就可以了.

在執行下面步驟前,你必須先下載並安裝最新版的FCKeditor編輯器.在FCKeditor.Net壓縮檔中並不包含編輯器的相關檔案,你必須先從下面的網址下載 : http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=75845

步驟 1

假設編輯器被安裝載您的網站中的"FCKeditor"資料夾裡. 現在你需要先下載FCKeditor ASP.Net控制項元件好在你的網頁中使用編輯器. 你可以後面這網址找到最新版的:
http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=137125

步驟 2

下載的ZIP檔中包含了原始的程式碼與編譯後的程式(在"bin"資料夾中). 所以現在只要將編譯後的程式加入你的專案中的參考. 你可以用下面這兩個方法達成:

  • 在Visual Studio.Net的方案總管中的參考按滑鼠右鍵加入參考.
  • 手動將DLL檔複製到網站的bin資料夾裡.
你可以將編輯器的控制項加到您的 Visual Studio.Net 工具箱中. 只要在工具箱上按滑鼠右鍵選擇"新增/移除項目". 然後選擇下載的DLL檔.

步驟 3

現在你已經可以在你的網站上使用這個編輯器了, 所以只要建立一個ASP.Net的網頁然後建立編輯器的物件即可.你可以用下面這兩個方式達成:

  • 只要從工具箱中拖拉編輯器的控制項到您的網頁中即可(如果你已經有照"步驟 2"中所說的將控制項增加到工具箱中).
  • 將下面這行程式加到你的ASP.Net網頁原始碼的最上方:
<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" %>
然後在<FORM runat="server">裏面加入編輯器的標籤:

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

完整範例

<%@ 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>

範例

你可以在FCKeditor.Net壓縮檔裡的"_samples/aspx"資料夾裡找到一些使用編輯器的範例程式. 要安裝這些範例, 只要複製該資料夾到FCKeditor編輯器所安裝的資料夾裡的"_samples"資料夾即可.

屬性

下列這些屬性可以在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
下列這些事件可以在ASP.Net伺服器控制項中被觸發. 

OnDataBinding
OnDisposed
OnInit
OnLoad
OnPreRender
OnUnload
特別注意,如果你是使用 using Asp.net 2.0 跟 themes: 你必須開啟 "\editor\filemanager\upload\aspx\upload.aspx" 跟 "editor\filemanager\browser\default\connectors\aspx\connector.aspx",然後修改第一行加入 Theme="" 如下所示:
<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false" Theme="" %>

關於檔案上傳,須先修改fckconfig.js中的
var _FileBrowserLanguage = 'asp' ;
var _QuickUploadLanguage = 'asp' ;
改成
var _FileBrowserLanguage = 'aspx' ;
var _QuickUploadLanguage = 'aspx' ;
另外,如果你要指定上傳的儲存資料夾,
你可以在你的web.config中設定預設的 UserFiles 路徑:

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

在你的程式中動態新增編輯器

如果你是使用應用程式方式(虛擬目錄),先在web.config中設定"Base path":

例如,如果你的FCKeditor路徑為"c:/inetpub/wwwroot/virtualdir/FCKeditor/"

就在web.config中新增下面這行:

<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/"
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)