• Spring mvc+Easyui遇到的几个问题


    简单的一个数据表的增删查改的总体界面的展示效果例如以下图:
    带有自己定义查询条件的数据列表界面

    1.datagrid数据载入问题
    datagrid通过url请求后台数据,总记录数和数据行的属性是固定死的。数据行是rows,总记录数为total

    List<Map<String,Object>> maplist = configMgrService.listAllAccessIps(pb);
    JsonConfig config = new JsonConfig();
    config.registerJsonValueProcessor(Timestamp.class, new DateJsonValueProcessor("yyyy-MM-dd HH:mm:ss"));
    config.registerJsonValueProcessor(Date.class,new DateJsonValueProcessor("yyyy-MM-dd"));
    JSONArray jsonArray=JSONArray.fromObject(maplist,config);//将list转换JSONArray对象
    Map<String,Object> result = new HashMap<String,Object>();
    result.put("total",pb.getCondition().get("total"));
    result.put("rows", jsonArray);
    response.setContentType("text/javascript;charset=UTF-8");  //防止中文乱码
    ObjectMapper objMap = new ObjectMapper();
    objMap.writeValue(response.getWriter(), result); 

    2.分页的问题
    我配置的是每页显示5条,结果一刷新就是10条,但点击下一页上一页不会有这个问题。


    解决:将pageSize属性配置在datagrid属性里边,假设单独通过datagrid来getPager,然后再配置就会出现这个问题

    var p = $('#infoAccessLimitDG').datagrid('getPager');
        $(p).pagination({
            pageSize:5,//这里配置的不会有什么作用
            beforePageText : '第',//页数文本框前显示的汉字  
            afterPageText : '页    共 {pages} 页',
            displayMsg : '当前显示 {from} - {to} 条记录   共 {total} 条记录'
        });
    $("#infoAccessLimitDG").datagrid({
        pageSize:5,//在这里配置才会起作用
        .....
    });

    3.中文乱码
    后台写回数据给前台时。前台中文显示乱码,不知道怎么回事,在xml文件配置解决不了乱码的问题。暂时的解决方式,就是在写数据前,给HttpServletResponse response设置下编码

    response.setContentType("text/javascript;charset=UTF-8");  //防止中文乱码
    ObjectMapper objMap = new ObjectMapper();
    objMap.writeValue(response.getWriter(), result); 

    4.日期格式化显示
    a.数据列显示的问题:后台数据格式为Date,前端显示的是yyyy-MM-dd 00:00:00格式。给数据列加入格式化器属性

    <th field="startDate" formatter="dateFormatter">有效日期(起)</th>
    
    //js代码
    function dateFormatter(val,row)
    {
        if(val != null)
        {
            var year = val.substring(0,4);
            var month = val.substring(5,7);
            var day = val.substring(8,10);
            return year + '-' + month + '-' + day;
        }
        else return "";
     }

    5.表单提交。表单中含有日期表单元素,总是提交不到后台~!


    表单。用的是easyUI提供的日期控件,获取值和设置有点点的不同

    $("#infoAccessLimitFm #endDate").datebox('getValue');//获取值
    $("#infoAccessLimitFm #startDate").datebox('setValue',row.startDate);//设置值

    以Ajax方式提交,提交不到后台

    $.ajax({  
              type:"POST",  
              url:url,  
              dataType: 'json',
              data:{'limitCode':limitcode,'accessIp':accessIp,'accessType':accessType,
                'appName':appName,'startDate':startDate,'endDate':endDate,'id':ialId},  
              success:function(data)
              {  
                alert(data.msg);
                $('#dlg').dialog('close');
                $("#infoAccessLimitDG").datagrid("reload"); 
              },
              error:function(e) 
              {  
                  alert("操作出错:"+e);  
              }
          }); 

    提交时。參数设值时。识别不了这个日期參数。导致提交失败。
    通过注解来格式化

    /**
    * 有效日期起始日期
     */
    @DateTimeFormat(pattern="yyyy-MM-dd")
    public Date startDate;
  • 相关阅读:
    DAY 228 python & mongo问题记录
    DAY 227 正则表达式大全
    DAY 230 python之实现从ftp下载文件到本地
    DAY 229 MongoDB 数组
    ASP.Net操作Excel(下)_上传读取文件
    级联样式文件共通样式整理
    多张表关联同时更新多条不同的记录
    【转】十大排序算法
    创建触发器,将数据库中表的修改记录进日志表
    1.初学 servlet
  • 原文地址:https://www.cnblogs.com/cynchanpin/p/7135905.html
Copyright © 2020-2023  润新知