最近在搞前段,不是很熟悉,很苦逼,折腾来折腾去的。不过也好乘机学习学习jquery,easy ui和json,收获还是蛮多的。
1)上传文件后的二次确认
通常来说一般人会选择先将文件上传的服务器,先不解析,拿到文件存储的路径然后跳页面再解析然后显示解析内容。我没有这样干,直接在上传的时候解析了文件,然后将文件的内容已json字符串的形式跟着跳到下个页面,然后第二个页面用jquery easy ui的datagrid组件异步获取传过来的json值。
public String freeReturnUpload() throws Exception{
try{
Map paramMap = new HashMap();
if (!verifyPrivilege(paramMap))
{
return "error";
}
if(excel != null){
//判断文件类型
if(!UserPledgeConstants.EXCEL_TYPE_ABOVE_2003.equals(contentType) &&
!UserPledgeConstants.EXCEL_TYPE_BELOW_2003.equals(contentType)){
errormsg = "上传文件不是excel";
return "error";
}
Map field = new HashMap();
field.put(0,"sellerQQ");
field.put(1,"dealId");
field.put(2,"fee");
field.put(3,"ppth");
field.put(4,"carryId");
//解析文件
ParseExcel parse = new ParseExcel(excel,field);
parse.parse();
//判断文件记录数
int rowCount = parse.getRowCount();
if(rowCount == 0){
errormsg = "上传文件中没有记录";
return "error";
}else if(rowCount > 50){
errormsg = "上传记录大于50条";
return "error";
}
List parseResult = parse.getParseResult();
Map result = new HashMap();
result.put("rows",parseResult);
jSONObject = JSONObject.fromObject(result);
jSONStr = jSONObject.toString();
}else{
errormsg = "没有上传文件";
logger.debugTrace("The Upload file is empty!");
return "error";
}
}catch(Exception e){
logger.errorTrace("Upload error!",e);
throw e;
}
return BaseAction.SUCCESS;
}
二次确认的JSP页面,翻了easy ui的api好久,都没找到一个可以通过rowindex直接返回row对象的方法,于是用了selectRow,getselected和unselectRow三个方法来去取当前的row对象,好挫啊....
<script language="javascript">
var rowIndex = 0;
$(function(){
$('#tt').datagrid({
title:'扣款文件二次确认',
iconCls:'icon-save',
width:540,
height:465,
nowrap: false,
striped: true,
collapsible:true,
url:'userpledge_freeReturnConfirm.action?jSONStr='+document.getElementById('jsonstr').value,
columns:[[
{field:'sellerQQ',title:'卖家',width:99},
{field:'dealId',title:'订单',width:157},
{field:'fee',title:'金额',width:50},
{field:'ppth',title:'PPTH',width:85},
{field:'carryId',title:'运单号',width:85},
{field:'state',title:'状态',width:30}
]],
rownumbers:true,
toolbar:[{
id:'btnsave',
text:'Save',
iconCls:'icon-save',
handler:function(){
$('#btnsave').linkbutton('disable');
var rows = $('#tt').datagrid('getRows');
if(rows.length > 0){
for(var i= 0;i < rows.length;i++){
rows[i].state = '<img src="http://pics.paipai.com/common/icon/loading.gif"></img>';
rowIndex = $('#tt').datagrid('getRowIndex',rows[i]);
$.ajax({
type:"post",
url:"userpledge_freeReturnUploadCompensate.action",
data:rows[i],
dataType:"json",
success:callback
});
}
}
}
}]
});
});
function callback(resultList){
$('#tt').datagrid('selectRow',rowIndex);
var row = $('#tt').datagrid('getSelected');
if(resultList == '-1'){
row.state = '<font color="red">E</font>';
}else{
row.state = '<font color="green">C</font>';
}
$('#tt').datagrid('refreshRow',rowIndex);
$('#tt').datagrid('unselectRow',rowIndex);
}
</script>
分享到:
相关推荐
jquery easy-ui的整体文件包,包括树,表单,表格等等,有demo,可以看相关demo后自己导入到项目用。
jquery easy ui 中文帮助
jquery 和 jquery easy UI
jquery easy ui 离线API文档 离线显示,还有各种css值得借鉴
本资源主要是教你快速的掌握jquery easy ui 的使用,让你一目了然,让你完全的理解和掌握它,让你完全有信心的告诉自己,这东西我懂了。
本资源是本人将SpringMVC + jQuery easy ui整合的CRUD demo,后台核心是spring注解实现的(通过jsbcTemplate连接数据库),前台有基本的jsp和easy ui 两种展现方式,数据库使用oracle,可以通过更改配置文件和驱动jar...
jquery Easy UI教程,很详细,很实用
jQuery EasyUI是一组基于jQuery的UI插件集合,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript,也不需要对css样式有深入的了解,开发者需要了解...
这两个模块是非常适合JQuery初学者学习的,我就是照着这两个资源学习的 非常好,我上传就是收藏一下。
博客配套源代码,包含jQuery Easy UI 的几个基础组件的代码示例。
包括jQuery的chm格式说明文档,demo压缩包。jQuery easy-ui的chm格式说明文档。
jquery easy ui chm说明文档,api
jquery easy ui 增改删 表格
jquery easy ui edatagrid 动态编辑表格 下拉框 联动 ,支持增加,编辑,删除行,日期狂,下拉框联动显示数据,测试ok
Jquery Easy UI 1.2.6实例代码
通过网站整理的Jquery easy ui 中文帮助手册,像书籍一样建立了层次目录,送给需要的朋友吧。
JQuery Easy UI 增删改查 包含SQL 使用JDBC+Servlet做的示例
jquery easy UI+spring3.0+struts2.1.8.1+hibernate3.5整合的CRM包括所有Jar包.
jquery easy ui Demo 框架
JQuery Easy UI源码