FCKEditor在Asp.net中如何使用!~

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(); 


 
定製FCKEditor的工具欄

修改fckeditor目錄下的 fckconfig.js 腳本

FCKConfig.ToolbarSets["Default"] = [   。。。 。。。 實現定製

控件的ToolbarSet 指定設置的工具欄是那個...默認是Default

 

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