最近在搞前段,不是很熟悉,很苦逼,折腾来折腾去的。不过也好乘机学习学习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离线API文档是开发者不可或缺的工具,它涵盖了所有组件的详细信息,帮助我们更好地理解和运用这个框架。同时,深入研究其CSS设计,能提升我们的界面设计水平,打造出更具吸引力的Web应用。
总结来说,jQuery Easy UI 提供了一个强大的工具集,可以帮助开发者快速构建用户界面。通过学习提供的模板,初学者可以了解到如何整合 HTML、CSS、JavaScript 以及 jQuery Easy UI 的组件,从而提高开发效率并创建出...
### jQuery Easy UI 使用详解 #### 一、简介与安装配置 jQuery Easy UI 是一个基于 jQuery 的简化用户界面库,提供了一系列预定义的 UI 组件,如按钮、对话框、网格等,大大简化了 Web 应用程序的开发过程。通过...
总结,`jQuery UI`和`jQuery Easy-UI`都是为了提升网页交互体验和设计美感的工具。jQuery UI提供了丰富的组件和自定义主题,适合需要深度定制的项目;而jQuery Easy-UI则更注重易用性和快速开发,适用于希望快速搭建...
总结来说,jQuery EasyUI 提供了丰富的 UI 控件和便捷的拖放功能,使 web 开发者能快速构建功能强大的交互式应用。无论是简单的页面布局调整,还是复杂的数据管理,都能轻松应对。只需熟悉其 API 和基本的 HTML 结构...
总结,jQuery Easy UI 框架以其简单易用、功能强大的特点,成为开发者构建企业级Web应用的理想选择。通过深入了解并熟练掌握这个框架,开发者可以快速构建出美观、高效的用户界面,提升项目的整体质量。
总结来说,jQuery Easy UI 是一款强大的前端框架,它以简洁的API和丰富的组件,极大地提高了Web开发效率。通过学习和掌握Easy UI,开发者可以快速构建出专业级别的企业级应用,同时享受到高效开发带来的乐趣。"Frame...
总结,jQuery Easy UI 的上下排序功能是通过`datagrid`和`treegrid`组件实现的,允许用户根据需求动态调整数据的显示顺序。同时,`easy ui移动排序`可能涉及到用户交互式的行移动功能,提高了数据管理的灵活性。通过...
这个压缩包"jquery easy UI+spring3.0+struts2.1.8.1+hibernate3.5整合的CRM包括所有Jar包"提供了一种基于Java的技术栈,用于构建客户关系管理(CRM)系统。下面将详细介绍这些组件以及它们之间的整合方式。 首先,...
**jQuery Easy UI学习交流文档*...总结来说,jQuery Easy UI是一个强大的前端框架,通过它可以快速构建功能丰富的Web应用。深入了解并熟练掌握其组件用法、数据绑定以及样式扩展,将极大地提升你的开发效率和应用质量。
总结而言,jQuery EasyUI 1.3.1是一个强大且易用的前端开发工具,它通过预设的组件和样式,极大地简化了前端开发工作,使开发者能够专注于业务逻辑,而非基础界面的构建。对于任何希望快速构建高效Web应用的团队或...
标题“jquery-easy-ui demo”表明我们将探讨这个框架的一些实际应用和示例,而“很好用的”描述则暗示了其易用性和实用性。 一、jQuery EasyUI 概述 jQuery EasyUI 是基于 jQuery 的轻量级框架,它集成了大量的 UI ...
总结来说,jQuery EasyUI 是一个强大的前端框架,它利用 jQuery 的便利性,为开发者提供了丰富的 UI 组件和便捷的数据交互手段。掌握 EasyUI 的使用,能显著提升 Web 应用的开发效率和用户体验。通过深入学习和实践...
总结起来,jQuery Easy UI Datagrid 是一个强大且灵活的数据展示组件,通过深入研究提供的完整项目源代码,我们可以学习到如何有效地配置和扩展 Datagrid,以满足不同应用场景的需求。这将有助于提升我们的前端开发...
总结来说,jQuery UI 1.8.18是一个功能强大且易用的UI框架,它的组件和主题设计为Web开发带来了极大的便利。通过深入理解每个组件的工作原理和主题机制,开发者可以更加高效地构建出富有吸引力和用户体验良好的Web...
总结来说,jQuery EasyUI 1.3.2是一个强大且易用的前端框架,它集成了jQuery的强大功能,并提供了一套完整的用户界面解决方案。通过这个框架,开发者可以快速构建功能丰富、界面美观的Web应用,大大提高了开发效率和...
**jQuery EasyUI 知识点详解*...总结,jQuery EasyUI 是一个强大且实用的前端框架,通过其丰富的组件和简洁的 API,能够快速构建出符合现代 Web 标准的交互式应用。无论是初学者还是经验丰富的开发者,都可以从中受益。
### jQuery Easy UI 功能属性详解 #### CSS 类定义与功能属性 jQuery Easy UI 是一个基于 jQuery 的用户界面库,提供了一系列丰富的用户界面组件,旨在简化网页应用的开发过程。其功能属性主要分为 CSS 片段和 JS ...
总结来说,"Easy-Ui后台搭建"涉及到的知识点主要包括:Easy-Ui框架的使用、页面布局的创建、数据表格的展示与交互、表单元素的构建、事件处理以及代码组织和构建工具的应用。通过熟练掌握这些技能,开发者能够快速...
总结,"jQuery UI Easy CHM文档"是开发人员的宝贵资源,它涵盖了jQuery UI的各个方面,无论是初学者还是经验丰富的开发者,都能从中获益。通过深入学习和实践,我们可以利用jQuery UI创造出功能强大、美观易用的Web...