.NET快速資訊化系統開發框架 V3.2->Web版本“產品管理”事例編輯介面新增KindEditor覆文本編輯控制元件
KindEditor是一套開源的HTML視覺化編輯器，主要用於讓使用者在網站上獲得所見即所得編輯效果，相容IE、Firefox、Chrome、Safari、Opera等主流瀏覽器。KindEditor使用JavaScript編寫，可以無縫的於Java、.NET、PHP、ASP等程式接合。KindEditor非常適合在CMS、商城、論壇、部落格、Wiki、電子郵件等網際網路應用上使用，2006年7月首次釋出2.0以來，KindEditor依靠出色的使用者體驗和領先的技術不斷擴大編輯器市場佔有率，目前在國內已經成為最受歡迎的編輯器之一。
我們在開始過程中經常需要富文字框的支援，應有些客戶的需求，在案例模組“產品管理”中增加了對KindEditor富文字框控制元件的支援。KindEditor富文字框控制元件的下載地址在文章的最後，需要的使用者可以下載。
產品管理主介面如下圖所示：
在產品管理主介面單擊編輯按鈕，開啟產品編輯介面，在編輯介面的描述欄位我們就用了KindEditor控制元件，如下圖所示：
使用方法如下圖程式碼所示：
1、引用KindEditor控制元件相關css與js到介面中，如下：
<link rel="stylesheet" href="~/Content/Scripts/kindeditor/themes/default/default.css" /> <script charset="utf-8" src="~/Content/Scripts/kindeditor/kindeditor.js"></script <script charset="utf-8" src="~/Content/Scripts/kindeditor/lang/zh_CN.js"></script>
2、 定義需要設定為KindEditor控制元件的html控制元件，如下：
<textarea style="width:300px;height:30px;" id="PRODUCTDESCRIPTION" name="PRODUCTDESCRIPTION" /> 3、在介面載入時指定關聯，如下程式碼：
<script type="text/javascript"> $(function(){ window.editor = KindEditor.create('#PRODUCTDESCRIPTION', { resizeType: 1, width: '500px',minWidth:'490px',height:'50px', urlType: 'domain', // 帶有域名的絕對路徑 allowFileManager: false, items: ['source', 'undo', 'redo', 'wordpaste', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist', 'formatblock', 'fontname', 'fontsize', 'forecolor', 'bold', 'italic', 'table', 'link', 'unlink', 'image'] }); }); </script>
4、對於具體的KindEditor控制元件的各引數與屬性說明可以參考該控制元件的官方網站說明即可。
相關文章：
RDIFramework.NET — 基於.NET的快速資訊化系統開發框架 — 系列目錄
RDIFramework.NET ━ .NET快速資訊化系統開發框架 ━ 工作流程元件介紹
一路走來數個年頭，感謝RDIFramework.NET框架的支持者與使用者，大家可以通過下面的地址瞭解詳情。
RDIFramework.net官方網站：http://www.rdiframework.net/
RDIFramework.Net官方部落格：http://blog.rdiframework.net/
同時需要說明的，以後的所有技術文章以官方網站為準，歡迎大家收藏！
RDIFramework.NET框架由專業團隊長期打造、一直在更新、一直在升級，請放心使用！
歡迎關注RDIFramework.NET框架官方公眾微信（微訊號： guosisoft），及時瞭解最新動態。掃描二維碼立即關注
