簡單的一個數據表的增刪查改的總體界面的展示效果例如以下圖：

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;

Spring mvc+Easyui遇到的幾個問題