大家知道FCKeditor是一款强大的富文本框控件,可能很多人还不知道如何把她加入到项目中,或者知道但是已经忘记了,没关系,我们在这学习学习,复习复习。
[color=red][b]1、下载fckeditor[/b][/color]
地址:http://ckeditor.com/
[color=red][b]2、导入jar包和文件[/b][/color]
fckeditor-java-core-2.6.jar
imageinfo-1.9.jar
fckeditor下的js、html等文件,可以删除所有以"_"开头的文件夹
[color=red][b]3、导入标签和使用标签[/b][/color]
[color=red][b]4、自定义工具栏[/b][/color]
配置fckconfig.js
[color=red]说明:[/color]
[color=red][b]5、配置文件上传(与Struts2共存)[/b][/color]
由于大部分情况下我们在配置Struts2的过滤器的时候都是用*,所以这边我要绕过她,在这里写一个过滤器先。
配置struts.xml,加入下面的代码片段
[color=red][b]6、配置web.xml[/b][/color]
[color=red][b]注意FCK的过滤器一定要配置在Struts2过滤器的前面[/b][/color]
[color=red][b]7、配置fckeditor.properties(就创建这个文件然后把下面的代码复制进去就行了)[/b][/color]
[color=red][b]1、下载fckeditor[/b][/color]
地址:http://ckeditor.com/
[color=red][b]2、导入jar包和文件[/b][/color]
fckeditor-java-core-2.6.jar
imageinfo-1.9.jar
fckeditor下的js、html等文件,可以删除所有以"_"开头的文件夹
[color=red][b]3、导入标签和使用标签[/b][/color]
<%@ taglib uri="http://java.fckeditor.net" prefix="fck" %>
<fck:editor instanceName="movInfo.info"></fck:editor>
<fck:editor inputName="movInfo.info" instanceName="movInfomation" toolbarSet="Basic"></fck:editor>
[color=red][b]4、自定义工具栏[/b][/color]
配置fckconfig.js
FCKConfig.ToolbarSets["Default"] = [
['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
'/',
['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
'/',
['Style','FontFormat','FontName','FontSize'],
['TextColor','BGColor'],
['FitWindow','ShowBlocks','-','About'] // No comma for the last row.
] ;
FCKConfig.ToolbarSets["Basic"] = [
['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink','-','About']
] ;
[color=red]说明:[/color]
instanceName 就是相当去控件的name
toolbarSet 就是设置你需要使用的功能样式,在上面定义的,当然你也可以自己增加新的
<fck:editor instanceName="movInfo.info" toolbarSet="Basic"></fck:editor>
[color=red][b]5、配置文件上传(与Struts2共存)[/b][/color]
由于大部分情况下我们在配置Struts2的过滤器的时候都是用*,所以这边我要绕过她,在这里写一个过滤器先。
package com.main.movie.filter;
import java.io.IOException;
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
public class FckUploadFilter implements Filter {
private String DispatcherUrl;
public void destroy() {
}
public void doFilter(ServletRequest request, ServletResponse response,
FilterChain chain) throws IOException, ServletException {
HttpServletRequest httprequest = (HttpServletRequest) request;
//其实就是根据传的参数来判断在做什么
if (httprequest.getParameter("Type") != null && httprequest.getParameter("Type").equals("Image")) {
//跳转到fck用的页面,不执行后面的过滤器
httprequest.getRequestDispatcher(DispatcherUrl).forward(request, response);
} else {
//否则才继续执行过滤器,所以在配置web.xml的时候要把该过滤器放在struts2的前面
chain.doFilter(request, response);
}
}
public void init(FilterConfig filterConfig) throws ServletException {
DispatcherUrl = filterConfig.getInitParameter("DispatcherUrl");
}
}
配置struts.xml,加入下面的代码片段
<constant name="struts.multipart.saveDir" value="/tmp"></constant>
[color=red][b]6、配置web.xml[/b][/color]
[color=red][b]注意FCK的过滤器一定要配置在Struts2过滤器的前面[/b][/color]
<!-- FckUploadFilter -->
<filter>
<filter-name>FckUploadFilter</filter-name>
<filter-class>com.main.movie.filter.FckUploadFilter</filter-class>
<init-param>
<param-name>DispatcherUrl</param-name>
<param-value>/fckeditor/editor/filemanager/connectors/</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>FckUploadFilter</filter-name>
<url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern>
</filter-mapping>
<!-- Fckeditor -->
<servlet>
<servlet-name>ConnectorServlet</servlet-name>
<servlet-class>net.fckeditor.connector.ConnectorServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>ConnectorServlet</servlet-name>
<url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern>
</servlet-mapping>
[color=red][b]7、配置fckeditor.properties(就创建这个文件然后把下面的代码复制进去就行了)[/b][/color]
# default allowed extensions settings
connector.resourceType.file.extensions.allowed = 7z|aiff|asf|avi|bmp|csv|doc|fla|flv|gif|gz|gzip|jpeg|jpg|mid|mov|mp3|mp4|mpc|mpeg|mpg|ods|odt|pdf|png|ppt|pxd|qt|ram|rar|rm|rmi|rmvb|rtf|sdc|sitd|swf|sxc|sxw|tar|tgz|tif|tiff|txt|vsd|wav|wma|wmv|xls|xml|zip
connector.resourceType.image.extensions.allowed = bmp|gif|jpeg|jpg|png
connector.resourceType.flash.extensions.allowed = swf|fla
connector.resourceType.media.extensions.allowed = aiff|asf|avi|bmp|fla|flv|gif|jpeg|jpg|mid|mov|mp3|mp4|mpc|mpeg|mpg|png|qt|ram|rm|rmi|rmvb|swf|tif|tiff|wav|wma|wmv
# default resource type paths
connector.resourceType.file.path = /file
connector.resourceType.image.path = /image
connector.resourceType.flash.path = /flash
connector.resourceType.media.path = /media
# Due to security issues with Apache modules, it is recommended to leave this
# setting enabled.
connector.forceSingleExtension = true
# base URL path for the userfiles
connector.userFilesPath = /fckupload
# base system path on the backend for the userfiles
connector.userFilesAbsolutePath = /fckupload
# Instructs the Connector to check, if the uploaded image is really one
connector.secureImageUploads = true
# directory of the editor relative to the context root
fckeditor.basePath = /fckeditor
# default height of the editor
fckeditor.height = 200
# default toolbar set of the editor
fckeditor.toolbarSet = Default
# default width of the editor
fckeditor.width = 100%
# default implementations
connector.impl = net.fckeditor.connector.impl.ContextConnector
connector.userActionImpl = net.fckeditor.requestcycle.impl.EnabledUserAction
connector.userPathBuilderImpl = net.fckeditor.requestcycle.impl.ContextPathBuilder
localization.localeResolverImpl = net.fckeditor.localization.impl.AcceptLanguageHeaderResolver