项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

时间:2023-11-23 16:56:32

1、收派标准添加

jQuery easyUI window使用

jQuery easyUI form表单校验

收派标准添加页面调整url params

服务端实现三层

2jQuery easyUI datagrid 使用方式

n 将静态HTML渲染为datagrid样式(html方式)

n 发送ajax请求获取动态json数据构造datagrid(html方式)

n 使用easyUI提供的API(js方式)动态创建datagrid(掌握

3、收派标准管理

n 收派标准分页查询(基于datagrid实现)

n 收派标准修改

4、快递员管理

n 快递员添加

快递员列表查询(no-Session)

-----------------------------------------------------------------------------

1.1 Validatebox表单校验

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

1、 给input加样式class=easyui-validatebox

2、 设置校验规则:

a) 非空规则 required:true

 项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

b) 其他规则:通过validType:指定规则

 

3、 在提交表单之前做表单校验:调用FORM的validate方法

1.1 通过调用easyui的API(js)创建datagrid(掌握

1、 在页面中添加table元素给出id

2、 页面加载完成调用API  datagrid将数据表格创建,通过json对象设置数据表格属性

当显示分页组件:

点击分页按钮发送请求,提交两个参数page(当前页数)   rows(每页显示记录数)

服务端响应返回符合规范数据json对象: total(总记录数)  rows(当前页的数据)

{

total: 12,

rows:[]

}

 

通过js方式创建数据表格

<table id="dg"></table>

<script type="text/javascript">

$('#dg').datagrid({

url:'../data/user.json', //发送请求   数据来源

columns:[[       //展示数据

{field:'id',title:'编号',width:100},

{field:'name',title:'姓名',width:100},

{field:'age',title:'年龄',width:100,align:'right'}

]],

pagination:true,//展示分页栏

/*

请求:提交参数

、rows(每页显示记录数)

响应:响应json数据

{

total:100,

 

rows:[]  //当前页记录

}

*/

toolbar:[{

iconCls: 'icon-edit',

text:"编辑",

handler: function(){ //点击事件

alert('edit')

}

},{

iconCls: 'icon-save',

text:"新增",

handler: function(){ //点击事件

alert('save')

}

},{

iconCls: 'icon-help',

text:'帮助',

handler: function(){alert('help')}

}] ,

rownumbers:true,

singleSelect:true,

striped:true,

  pageSize:3,

 

  pageList:[3,10]

});

</script>

收派标准分页

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

@Action("standardAction_pageQuery")

public String pageQuery() throws Exception {

//dao中方法  Page<T> findAll(Pageable pageable);

//pageable:封装当前页 每页展示记录数

Pageable pageable = new  PageRequest(page-1, rows);

//返回Page对象中:包含当前页记录 总记录数等

Page<Standard> page =  standardService.pageQuery(pageable);

System.out.println("查询到总记录数:"+page.getTotalElements());

System.out.println("查询当前页记录:"+page.getContent());

Map<String, Object> map = new HashMap<>();

map.put("total", page.getTotalElements());

map.put("rows", page.getContent());

//转json gson;jsonlib,fastjson,jackson

//Jsonlib转json

//转对象,map 使用JSONObject

//转集合,数组说那个JSONArray

//将对象转为json

String json = JSONObject.fromObject(map).toString();

System.out.println(json);

ServletActionContext.getResponse().setContentType("text/json;charset=utf-8");

ServletActionContext.getResponse().getWriter().write(json);

return NONE;

实现收派标准修改功能

1.1 页面调整

查询easyui API:

Datagrid的方法:获取选中的记录

 项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

form表单方法:回显数项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

1、 给修改按钮设置点击事件:1判断2、获取选中记录3在表单中回显数据 4打开窗口

 项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

 

1.1 使用combobox展示收派标准数据

1、 页面:pages/base/courier.jsp

2、 修改combobox的url

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

1、 在收派标准action中添加查询所有收派标准,返回json数组形式

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

1.1 No session(理解)

初始化快递员对象中 定区集合

Web层转Courier对象为json串时候,对象中有fixedareas集合属性,jpa集合属性加载策略延迟加载。在action中转fixedareas集合为json串,通过代理对象查询数据库,action层中session已经关闭。

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

1、 解决方案:

1、 解决方案:方式一:使用过滤器延迟session生命周期:在web层(页面渲染完毕)关闭session

仅解决解决noSession问题

在web.xml中配置过滤器,当页面渲染完毕后关闭session

<!-- 必须放在struts2核心过滤器之前作用,延迟session生命周期 -->

<filter>

<filter-name>openEntityManagerInViewFilter</filter-name>

<filter-class>org.springframework.orm.jpa.support.OpenEntityManagerInViewFilter</filter-class>

</filter>

<filter-mapping>

<filter-name>openEntityManagerInViewFilter</filter-name>

<url-pattern>/*</url-pattern>

</filter-mapping>

a) 方式二:将集合属性改为立即加载(效率低不用)

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

b) 方式三:

1、 方式二:将实体中不需要转json的属性排除掉

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

1、 页面中展示数据:

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询

项目一:第三天 收派标准添加 收派标准分页查询(基于datagrid实现) 收派标准修改快递员添加 快递员列表查询