Nhúng FCK editor vào ứng dụng ASP.NET
Nguồn : forum.t3h.vn
Nhúng FCK editor vào ứng dụng ASP.NET
Giới thiệu:
FCK Editor là 1 công cụ soạn thảo văn bản mã nguồn mở (giống như Microsoft
Word) mà có thể tích hợp vào ứng dụng web như (asp/asp.net, php,
coldFusion,Java,Python...)
FCK là từ viết tắt của Frederico Caldeira Knabben, nó hổ trợ hầu hết các trình
duyệt bao gồm: internet Explorer 5.5+(Window), Firefox 1.0+, Safari 3.0+, Opera
9.5+, Mozilla 1.3+ và Netscape.
Cách dùng:
FCK editor phát hành bao gồm 1 gói javascript và 1 thành phần (component) dành
cho .NET, để có thể nhúng (embed) FCK vào 1 ứng dụng web asp.net, chúng ta
cần phải tải đủ 2 gói này tại đây
Code:
http://www.fckeditor.net/download
Phiên bản hiện tại của FCK Editor là : FCKeditor v2.6.3.Và component dành cho
asp.net có thể tãi tại đây
Code:
http://sourceforge.net/project/showfiles.php?group_id=7
5348&package_id=137125
Ở đây mình sẻ sử dụng FCK phiên bản mới nhất và hổ trợ 2 ngôn ngữ VB.NET và
C#.
Bước 1: Tạo 1 solution bằng Visual Studio 2008 tên FCK.Editor (tuỳ), sau đó
thêm 1 website mới ngôn ngữ mà bạn đang sài.
Bước 2: Giải nén mã nguồn FCK editor và thêm component FCK editor vào
Toolbox.
Giải nén mã nguồn FCK editor chúng ta có 1 thư mục đặt tên là fckeditor và 1
.NET component FredCK.FCKeditorV2.dll, chúng ta đặt component và thư mục
fckeditor như hình bên dưới.
Bước 4: thêm FredCK.FCKeditorV2.dll vào toolbox
Để sử dụng control FCK bạn phải add toolbox bằng cách click toolbox và chọn
choose items... và chọn file FredCK.FCKeditorV2.dll, hoặc kéo
FredCK.FCKeditorV2.dll vào toolbox.
Bước 5: thêm control vào page
Chúng ta kéo FCK editor từ toolbox vào page, thì control sẻ được thêm vào và
đăng ký assembly và namespace cần thiết.
Click chuột phải chọn View Browser hoặc nhấn F5 để xem kết quả.
Bước 6: cấu hình để upload hình ảnh.
Nếu bạn cố gắng upload hình qua control image thì sẻ gặp lổi như phía dưới.
Code:
XML request error: OK (200)
Requested URL:
http://localhost:2677/CS/fckeditor/editor/filemanager/c
onnectors/php/connector.php?Command=GetFoldersAndFiles&
Type=Image&CurrentFolder=%2F&uuid=1223039353048
Để khắc phục vấn đề này chúng ta phải cấu hình lại FCK editor, để cho phép
người dùng có thể upload hình thông qua control image.
6.1 - Tạo 1 thư mục img để lưu hình người dùng tải lên.
6.2 - Tạo 1 file Global.asax và thiết lập đường dẩn hình upload.
Thêm đoạn code trong sự kiện Application_Start
CS:
Code:
void Application_Start(object sender, EventArgs e)
{
// Code that runs on application startup
Application["FCKeditor:UserFilesPath"] =
"../../../../../img/";
}
VB.NET
Code:
Sub Application_Start(ByVal sender As Object, ByVal
e As EventArgs)
' Code that runs on application startup
Application("FCKeditor:UserFilesPath") =
"../../../../../img/"
End Sub
6.3 - chỉnh sửa FileBrowserLanguage và QuickUploadLanguage ->> aspx của file
fckconfig.js trong thư mục fckeditor.
Thử upload 1 hình thông qua control image thì sẻ gặp lổi như hinh sau: