实例解析：统计信息管理、Spring注解开发和EasyUI

@Service("customerService")
@Transactional(isolation=Isolation.REPEATABLE_READ,propagation=Propagation.REQUIRED,readOnly=false)public class CustomerServiceImpl implements CustomerService {
    @Resource(name="customerDao")private CustomerDao cd;

nbsp;html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;<meta><title>客户信息管理</title><link><link><script></script><script></script><script></script><script>//点击提交按钮触发该方法提交表单
function submitForm(){
// submit the form    
$(&#39;#ff&#39;).submit();  
}

        $(function(){
            //-------------------------------------------------------------------------
            $(&#39;#w&#39;).window(&#39;close&#39;); //页面加载完成,确保窗口关闭
            //-------------------------------------------------------------------------
            $(&#39;#ff&#39;).form({    
                url:&#39;${pageContext.request.contextPath}/UserAction_regist&#39;,    
                onSubmit: function(){    
                    // do some check    
                    // return false to prevent submit; 
                    return true;//让表单直接提交
                },    
                success:function(data){ //提交成功后调用的方法  
                    $(&#39;#w&#39;).window(&#39;close&#39;);//提交成功关闭窗口
                    $(&#39;#test&#39;).datagrid(&#39;reload&#39;); //提交成功,重新加载列表数据   
                    $(&#39;#ff&#39;).form(&#39;clear&#39;);//提交成功后,清空表单
                }    
            });  
        
            
            //--------------------------------------------------------------------------
            $(&#39;#test&#39;).datagrid({
                title:&#39;用户列表&#39;, //表格标题
                singleSelect:true, //只允许单选
                iconCls:&#39;icon-tip&#39;,//表格标题图标
                //width:700, //宽度
                //height:350, //高度
                nowrap: true,//某列数据较长时,是否需要换行
                striped: true,//是否隔行变色
                collapsible:false,//是否可以折叠表格
                url:&#39;${pageContext.request.contextPath}/UserAction_list&#39;,//指定表格数据加载的路径
                sortName: &#39;user_id&#39;,//指定可以使用哪列进行排序
                sortOrder: &#39;desc&#39;,//指定默认排序规则 asc/desc
                remoteSort: false,//是否支持远程
                idField:&#39;user_id&#39;, //那一列是id列
                frozenColumns:[[
                    {field:&#39;ck&#39;,checkbox:true},
                    {title:&#39;用户id&#39;,field:&#39;user_id&#39;,width:80,sortable:true}
                ]],
                columns:[[
                    {field:&#39;user_name&#39;,title:&#39;用户名&#39;,width:120},
                    {field:&#39;user_code&#39;,title:&#39;登录名&#39;,width:220}
                ]],
                pagination:true,
                rownumbers:true,
                toolbar:[{ //配置工具栏
                    id:&#39;btnadd&#39;,
                    text:&#39;添加用户&#39;,
                    iconCls:&#39;icon-add&#39;,
                    handler:function(){
                        $(&#39;#btnsave&#39;).linkbutton(&#39;enable&#39;);
                        //打开前清空表单
                        $(&#39;#ff&#39;).form(&#39;clear&#39;);
                        //打开表单窗口
                        $(&#39;#w&#39;).window(&#39;open&#39;);
                    }
                },{
                    id:&#39;btncut&#39;,
                    text:&#39;修改用户&#39;,
                    iconCls:&#39;icon-cut&#39;,
                    handler:function(){
                        $(&#39;#btnsave&#39;).linkbutton(&#39;enable&#39;);
                        //获得被选中的用户的id
                        var user_id = getSelected();
                        
                        if(!user_id){
                            alert("请选择用户!");
                            return;
                        }
                        //根据id回显数据
                        $(&#39;#ff&#39;).form(&#39;load&#39;,&#39;${pageContext.request.contextPath}/UserAction_toEdit?user_id=&#39;+user_id);
                        //清空密码输入框
                        
                        //打开编辑窗口
                        $(&#39;#w&#39;).window(&#39;open&#39;);
                    
                    }
                },&#39;-&#39;,{
                    id:&#39;btnsave&#39;,
                    text:&#39;删除用户&#39;,
                    disabled:false, //禁用属性
                    iconCls:&#39;icon-save&#39;,
                    handler:function(){
                        $(&#39;#btnsave&#39;).linkbutton(&#39;enable&#39;);//点击后按钮是否可以继续点击
                        //获得被选中的用户id
                        //获得被选中的用户的id
                        var user_id = getSelected();
                        //判断id不能为空
                        if(!user_id){
                            alert("请选择用户!");
                            return;
                        }
                        //调用ajax异步发送请求删除用户
                        $.get("${pageContext.request.contextPath}/UserAction_delete?user_id="+user_id, function(data){
                                //删除成功后,刷新列表
                             $(&#39;#test&#39;).datagrid(&#39;reload&#39;); //提交成功,重新加载列表数据   
                            });
                    }
                }]
            });
            var p = $(&#39;#test&#39;).datagrid(&#39;getPager&#39;);
            $(p).pagination({
                onBeforeRefresh:function(){
                    alert(&#39;before refresh&#39;);
                }
            });
        });
        function resize(){
            $(&#39;#test&#39;).datagrid(&#39;resize&#39;, {
                width:700,
                height:400
            });
        }
        //获得被选中的
        function getSelected(){
            var selected = $(&#39;#test&#39;).datagrid(&#39;getSelected&#39;);
            if (selected){
                return selected.user_id;
            }
        }
        function getSelections(){
            var ids = [];
            var rows = $(&#39;#test&#39;).datagrid(&#39;getSelections&#39;);
            for(var i=0;i<rows.length;i++){
                ids.push(rows[i].code);
            }
            alert(ids.join(&#39;:&#39;));
        }
        function clearSelections(){
            $(&#39;#test&#39;).datagrid(&#39;clearSelections&#39;);
        }
        function selectRow(){
            $(&#39;#test&#39;).datagrid(&#39;selectRow&#39;,2);
        }
        function selectRecord(){
            $(&#39;#test&#39;).datagrid(&#39;selectRecord&#39;,&#39;002&#39;);
        }
        function unselectRow(){
            $(&#39;#test&#39;).datagrid(&#39;unselectRow&#39;,2);
        }
        function mergeCells(){
            $(&#39;#test&#39;).datagrid(&#39;mergeCells&#39;,{
                index:2,
                field:&#39;addr&#39;,
                rowspan:2,
                colspan:2
            });
        }
    </script>