此前的一篇文章介绍了xheditor使用servlet实现上传的接口,但在Struts2的应用中由于Struts2封装了request和response使得,此前写的程序无法获取数据。可能通过一些修改可以另前面的程序继续使用,但是我这里介绍一种完全使用Struts2标准的xheditor配置方法。其实这个方法在xheditor的官方论坛有讲过,但是由于讲述并不清楚,可能对于一些新手使用并不方便,我这里结合我使用的方法,整理出来代码供大家参考。
1、首先是在textarea中配置class
class=“xheditor {skin:'o2007blue',html5Upload:false,upMultiple:'1',upImgUrl:'Upload.do',upImgExt:'jpg,jpeg,gif,bmp,png',upLinkUrl:'Upload.do',upLinkExt:'zip,rar,txt,docx,doc,xls,xlsx,pdf'}"
注意到我这里的上传的Action是Upload.do
2、接着下来配置Struts.xml来解析配置
<action name="Upload" class="com.webapp.action.XheditorUploadAction" method="uploadPicture">
<result> /SuccessUpload.jsp </result>
</action>
这个xml配置主要是做一些简单的返回,最后我会具体的写明白返回的jsp应该怎么写
3、这步就主要编写Upload的Action
package com.webapp.action;
import java.awt.Image;
import java.io.File;
import javax.imageio.ImageIO;
import org.apache.commons.io.FileUtils;
public class XheditorUploadAction extends PersonCommonAction {
private File filedata;
private String filedataContentType;
private String filedataFileName;
private String err;
private String msg;
private String message;
private String fileExt = "jpg,jpeg,gif,bmp,png";
public String uploadPicture() throws Exception {
String saveRealFilePath = getSession().getServletContext().getRealPath("/") + "resources/XheditorUpload/" ;
File fileDir = new File(saveRealFilePath);
if (!fileDir.exists()) {
fileDir.mkdirs();
}
File savefile;
savefile = new File(saveRealFilePath + filedataFileName);
FileUtils.copyFile(filedata,savefile);
msg = "resources/XheditorUpload/" + filedataFileName;
err="";
printInfo( err, msg);
return SUCCESS;
}
public void printInfo(String err,String newFileName) {
message = "{\"err\":\"" + err + "\",\"msg\":\"" + newFileName
+ "\"}";
}
public String uploadJsp()
{
return SUCCESS;
}
public File getFiledata() {
return filedata;
}
public void setFiledata(File filedata) {
this.filedata = filedata;
}
public String getFiledataContentType() {
return filedataContentType;
}
public void setFiledataContentType(String filedataContentType) {
this.filedataContentType = filedataContentType;
}
public String getFiledataFileName() {
return filedataFileName;
}
public void setFiledataFileName(String filedataFileName) {
this.filedataFileName = filedataFileName;
}
public String getErr() {
return err;
}
public void setErr(String err) {
this.err = err;
}
public String getMsg() {
return msg;
}
public void setMsg(String msg) {
this.msg = msg;
}
public String getMessage() {
return message;
}
public void setMessage(String message) {
this.message = message;
}
}
这里重点理解的是filedata,因为xheditor会把filedata的值写到值栈里边,而Struts2会自动获取这个值
4、接着是SuccessUpload.jsp
<%@ taglib prefix="s" uri="/struts-tags" %>
<s:property value="message" escape="false"/>
这个很简单,就在jsp页面里边写两行就可以了,其实这里是把message的值打印出来,返回给xheditor而已
分享到:
相关推荐
- 在前端,xheditor的配置中设置图片上传的URL为Struts2的Action地址,并配置相关参数,如文件名、类型等。 - 服务器端接收到请求后,使用Action类的字段保存文件,并返回上传成功或失败的信息。 5. **安全考虑**...
在xhEditor的配置项中,我们可以设置`upLinkUrl`参数为Struts2的Action路径,这个Action将处理图片上传请求。例如: ```javascript var editor = $("#editor").xheditor({ upLinkUrl: "uploadImage.action", ...
在Struts中,Action类作为控制器,Form Bean作为模型,JSP页面作为视图。 集成XhEditor到Struts项目中,我们首先要在项目的公共资源目录下引入XhEditor的JavaScript和CSS文件,通常是在WEB-INF目录下的js或css子...
用于xheditor编辑器上传功能的配置文件 upload.aspx,直接下载拷贝到项目根目录下即可。 里面的该行: string attachdir ="../upload"; 是上传路径,根据实际引用xheditor的页面位置,要进行相应的修改,要不然无法...
2. **配置Action**:在struts-config.xml文件中配置相应的Action,指定Action的执行类以及与之关联的JSP页面。Action需要处理由XHeditor提交的数据,这可能涉及到对POST请求的解析。 3. **JSP页面**:在JSP页面上,...
最后,用户在XHEditor中点击“插入图片”按钮,选择本地图片后,编辑器会自动发起POST请求到设定的`upImgUrl`,并将图片数据作为文件部分上传。服务器接收到请求后,按照上述JSP代码处理图片,保存到服务器,并将...
总结,xhEditor在ASP.NET中的应用为开发者提供了强大的富文本编辑功能,通过简单的配置和集成,可以轻松实现网页编辑区域的增强,提升用户体验。同时,它的高度可定制性使得开发者可以根据项目需求进行功能裁剪和...
在提供的文件列表中,“XheditorUpload”可能是用于存放Xheditor上传图片时的服务器端代码,而“说明.txt”则可能包含详细的步骤说明或者关键配置信息。 总结来说,这个项目是关于如何在ASP.NET环境中利用Xheditor...
1. **配置上传参数**:在XHEditor的配置项中,可以设置上传的URL、参数等。例如: ```javascript var editor = XHEditor.create('#editor-id', { upload: { url: '/upload/image', // 上传接口地址 params: {...
在XHEditor的配置中,你需要指定上传的相关参数,如URL、允许的文件类型等。例如: ```javascript $('#myEditor').xheditor({ tools: 'full', upImgUrl: 'upload.php', // 上传图片的URL upImgExt: 'jpg,jpeg,...
xheditor1.1.13在ASPNET开发网站中的使用,C#,vs2013,实现在线编辑html流,包括本地图片的上传,非常简洁,稍加扩充可用于自己的网站(如博客网站等) 本例xheditor控件采用自定义模式,可参照进行重新配置,实现控件的增减,...
1. **捕获用户操作**:在XHEditor的配置中,设置图片上传的相关参数,比如启用远程图片抓取功能,并设定相应的服务器端处理脚本。 2. **服务器端处理**:当用户在编辑器中插入远程图片URL时,XHEditor会向服务器...
XHEditor是一款开源的JavaScript富文本编辑器,它提供了丰富的API和自定义选项,能够支持多种浏览器,包括IE6、Firefox、Chrome、Safari以及Opera等,使得开发者可以轻松地在网页中添加文本编辑和格式化功能。...
XHEditor以其轻量级、高效能和高度可定制性在众多在线编辑器中脱颖而出。 1. **核心特性** - **所见即所得(WYSIWYG)**: 用户在浏览器中直接编辑内容,看到的效果与最终发布的内容一致。 - **多语言支持**: ...
xheditor在asp.net中使用时,如果textbox控件在UpdatePanel使用无刷新提交时,原先的样式就丢失,此时需要使用脚本重新加载。在本文件在包含完整的xheditor-1.1.13及其demos。在demos文件夹里的Default2.aspx及...
xheditor以其简单易用和高度可定制性深受开发者喜爱,特别是对Java开发者的友好性,使其在Java项目中广泛应用。 **1. xheditor特性** - **多语言支持**:xheditor内置多种语言包,满足不同地区用户的需求。 - **...
2. 实时预览:在编辑过程中,XHEditor会实时显示编辑结果,用户可以随时看到内容的实际样式。但为了确保在不同浏览器下的显示一致性,建议在正式发布前进行多平台、多浏览器的预览测试。 五、安全与优化 1. 防SQL...
在描述中提到的“完整实例”意味着这个压缩包包含了xheditor的所有必要文件,下载后无需额外配置,可以直接在项目中应用。"copy一下"的提示表明,开发者只需要将这些文件复制到自己的项目目录下,就能快速启用...
在实际应用中,xheditor可以通过自定义配置来满足不同的需求,例如设置字体、颜色、对齐方式、列表样式等文本格式,还可以添加链接、插入表格、创建无序或有序列表等。此外,为了保证安全性,xheditor通常会提供一些...
3. **初始化编辑器**:在JavaScript中调用XHEditor的初始化方法,指定刚刚创建的`<div>`元素作为编辑器的容器。 ```javascript Xinha.Config.prototype.plugins = ['FullScreen', 'Table', 'ImageManager']; Xinha....