[ExtJS]WYSIWYG所視即所得網頁編輯器外掛 with CKEditor

ExJS所提示的HtmlEditor非常簡單,一般來說算夠用了,不過還是有很多狀況無法適用,所幸ExtJS可利用擴充的方式來使用其它的WYSIWYG編輯器,TinyMCE是個很好的選擇,FCKEditor也不錯,現在重新被制作改名成CKEditor,以下的範例是使用CKEditor來砍進ExJS當成它的HtmlEditor。

CKEditor.png




範例是由這個網址取得的

http://www.sencha.com/forum/showthread.php?79031-CKEditor-Extension

example實作的方式

其中要開啟CKEditor的功能可以從toolbar這個參數裡設定toolbar:'Full'是全部啟用,toolbar:'Basic'是只有簡單功能,跟內建的ExtJS HtmlEditor有點像,以下是全部的項目,可以選擇要放置的位置及啟用的功能

html的部份

原始碼下載及附件下載

下一篇會再加Servlet上傳檔案、圖檔及Flash功能的實作

JSP上傳檔案、圖檔及Flash功能的實作

PHP上傳檔案、圖檔及Flash功能的實作

補充內容:Fix form.getForm().getFieldValues(false);取不到值的bug

取值方法

0 comments on “[ExtJS]WYSIWYG所視即所得網頁編輯器外掛 with CKEditor

    1 Pings/Trackbacks 於 "[ExtJS]WYSIWYG所視即所得網頁編輯器外掛 with CKEditor"

    1. [...] 在上一篇[ExtJS]WYSIWYG所視即所得網頁編輯器外掛 with CKEditor有提到如何在ExtJS裡使用WYSIWYG所視即所得的網頁編輯器,不過並沒有上傳檔案或圖片的功能,要開啟上傳的功能只需要在CKConfig增加三個參數設定指定要做上傳動作的url就可以啟動了,在這篇並附上Servlet實作傳檔的功能。 filebrowserUploadUrl : 'ckeditor/uploader?Type=File',//檔案上傳的url filebrowserImageUploadUrl : 'ckeditor/uploader?Type=Image',//圖檔上傳的url filebrowserFlashUploadUrl : 'ckeditor/uploader?Type=Flash',//flash上傳的url [...]

    發表迴響

    你的電子郵件位址並不會被公開。 必要欄位標記為 *

    *