The application of CKEditor Rich text in Project

Our project needs to implement a repository content maintenance and presentation capabilities. Originally is the Word document for maintenance, now want to be able to entry into the database, the background for maintenance management, the front user login site to view the content of the knowledge base. We use the CKEditor data maintenance work, the front desk directly to the HTML file flow in the JSP page display, provide the problem of fuzzy search function. The next step is to briefly explain our implementation plan.

CKEditor Implement background Content management work

CKEditor is an open-source, rich-text editor dedicated to Web pages that our project uses to achieve rich text editing capabilities. Our knowledge base data is maintained by the administrator through the backend system to the database in one piece. The contents of the knowledge base are pasted directly from the Word document into CKEditor, and all Word formats are retained. CKEditor automatically converts word text into HTML-formatted data, and the database uses BLOB fields to access HTML streams. CKEditor plugin Download

The following is a small section of the CKEditor use code.

Read the value of CKEditor

adapt to different editing mode and Firefox browser
var oeditor =fckeditorapi.getinstance ("body");
if (oeditor.editordocument!=null) {
	body= OEditor.EditorDocument.body.innerHTML;
} else if (typeof (Oeditor.editingarea)!= ' undefined '  
	&& typeof (OEditor.EditingArea.Textarea)!= ' Undefined ') {
		if (window.navigator.userAgent.indexOf ("MSIE") >=1) {
			    		
			body= OEditor.EditingArea.Textarea.innerText;
		} else{
			    		
			 body=oeditor.editingarea.textarea.value
		     }
}

Assign value to CKEditor

Fckeditorapi.getinstance (' body '). EditorDocument.body.innerHTML = Obj.body;

Our background management is in the ExtJS development, so the above are JS code. Java code Implementation to select or insert these data into the database, specifically not table.

JSP foreground display Knowledge Base content

Because CKEditor is stored in the database is the flow of HTML, we only need to read the front desk, and then loaded into the JSP page to achieve the foreground display function.

	public void Getreportdetail () {
		HttpServletRequest request = Getrequest ();
		HttpServletResponse response = GetResponse ();
		String docId = request.getparameter ("id");
		Long id = null;
		String content = "";
		try{
			id = long.valueof (base64.decode (docId));
			Content = new String (resourceservice.getdoccontent (ID), "GBK");
		} catch (Exception e) {
		}
		beanutil.printstr (response, content);
	}

The front desk uses jquery to load data into the interface.

    function View (el,id) {
        $.ajax ({
	            url:contextpath+ "/jsp/cms/getreportdetail.do",
	            data:{id:id},
	            Success:function (data) {
		            $ ("#stable"). Hide ();
		            $ ("#report_mid"). Slideup ();
	                $ ("#cot H2"). HTML ($ (EL). attr ("title"));
	                $ ("#cot. Date"). HTML ($ (EL). Next ("Strong"). html ());
	                $ ("#cot p"). HTML (data);
	                $ ("#cot"). Slidedown ();