本文经过了测试，解决getFullyear() is not a function等问题
效果如下：
首先：
Oracle中字段设置为DATE，MySQL中设置为DATETIME，MyBatis中会自动映射为TimeStamp；
其次：
model实体类中字段使用sql.Timestamp，如果设置为DATE类型，那么时分秒会显示为00:00:00这样显然没有什么意义。
1 function formatterdate(val, row) {
2 if (val != null) {
3 var date = new Date(val);
4 return date.getFullYear() + ‘-‘ + (date.getMonth() + 1) + ‘-‘
5 + date.getDate();
6 }
7 }
8 /**
9 * 格式化日期（不含时间）
10 */
11 function formatterdate1(val, row) {
12 if (val != null) {
13 var date = new Date(val);
14 return date.getFullYear()
15 + "-"// "年"
16 + ((date.getMonth() + 1) > 10 ? (date.getMonth() + 1) : "0"
17 + (date.getMonth() + 1)) + "-"// "月"
18 + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate());
19 }
20 }
21 /**
22 * 格式化日期（含时间"00:00:00"）
23 */
24 function formatterdate2(val, row) {
25 if (val != null) {
26 var date = new Date(val);
27 return date.getFullYear()
28 + "-"// "年"
29 + ((date.getMonth() + 1) > 10 ? (date.getMonth() + 1) : "0"
30 + (date.getMonth() + 1)) + "-"// "月"
31 + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate())
32 + " " + "00:00:00";
33 }
34 }
35 /**
36 * 格式化去日期（含时间）
37 */
38 function formatterdate3(val, row) {
39 if (val != null) {
40 var date = new Date(val);
41 return date.getFullYear()
42 + "-"// "年"
43 + ((date.getMonth() + 1) > 10 ? (date.getMonth() + 1) : "0"
44 + (date.getMonth() + 1))
45 + "-"// "月"
46 + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate())
47 + " "
48 + (date.getHours() < 10 ? "0" + date.getHours() : date
49 .getHours())
50 + ":"
51 + (date.getMinutes() < 10 ? "0" + date.getMinutes() : date
52 .getMinutes())
53 + ":"
54 + (date.getSeconds() < 10 ? "0" + date.getSeconds() : date
55 .getSeconds());
56 }
57 }
以上是Common.js，引入到需要使用的jsp文件中。
1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
2 <%
3 String path = request.getContextPath();
4 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
5 %>
6 <!DOCTYPE html>
7 <html>
8 <head>
9 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
10 <title>File Info</title>
11 <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/default/easyui.css">
12 <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/icon.css">
13 <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/color.css">
14 <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/demo/demo.css">
15 <link rel="stylesheet" type="text/css" href="../css/info.css">
16 <script type="text/javascript" src="../jquery-easyui-1.4.1/jquery.min.js"></script>
17 <script type="text/javascript" src="../jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
18 <script type="text/javascript" src="../jquery-easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>
19 <!-- <script type="text/javascript" src="../js/jquery-1.8.0.min.js"></script> -->
20 <script type="text/javascript" src="../js/Common.js"></script>
21 </head>
22 <body>
23 <!-- 显示文件信息的表格 -->
24 <table id="dg" class="easyui-datagrid" style="height: 470px;"
25 url="findAll.do"
26 toolbar="#toolbar" pagination="true"
27 rownumbers="true" fitColumns="true" singleSelect="true"
28 data-options="fit:false,border:false,pageSize:5,pageList:[5,10,15,20]" >
29 <thead>
30 <tr>
31 <!-- 此处必须和实体类字段一致 -->
32 <th field="filename" width="50">文件名</th>
33 <th field="filepath" width="50">文件路径</th>
34 <th field="updatedate" width="50">上传时间</th>
35 </tr>
36 </thead>
37 </table>
38 <table id="tdList"></table>
39 <script type="text/javascript">
40 var $jq = jQuery.noConflict();
41 $jq(function () {
42 $jq("#tdList").datagrid({
43 url: "findAll.do",
44 title: "数据字典列表",
45 loadMsg: ‘正在加载信息...‘,
46 width: "100%",
47 idField: "Id",
48 fitColumns: true,
49 pagination: true,
50 pageSize: 10,
51 pageList: [10, 20, 35, 50],
52 singleSelect: true,
53 rownumbers: true,
54 columns: [[
55 { field: ‘filename‘, title: ‘文件名‘, width: 120 },
56 { field: ‘filepath‘, title: ‘文件路径‘, width: 80 },
57 {
58 field: ‘updatedate‘, title: ‘上传时间‘, width: 80,
59 formatter : formatterdate3
60 }
61
62 ]],
63 toolbar: [{
64 id: ‘add‘,
65 text: ‘添加‘,
66 iconCls: ‘icon-add‘,
67 handler: add
68 }],
69 onLoadSuccess: function (data) {
70 if (!data.rows) {
71 var body = $jq(this).data().datagrid.dc.body2;
72 body.find(‘table tbody‘).append(‘<tr><td width="‘ + body.width() + ‘" style="height: 25px; text-align: center;">没有数据</td></tr>‘);
73 }
74 }
75 });
76 });
77
78
79 function add(){
80 $jq("#add").dialog({
81 title: "添加数据字典类别",
82 collapsible: true,
83 minimizable: true,
84 maximizable: true,
85 resizable: true,
86 width: 400,
87 height: 260,
88 buttons: [{
89 text: "保存",
90 iconCls: "icon-add",
91 handler: function () {
92 $jq("#add form").submit();
93 }
94 }, {
95 text: "取消",
96 iconCls: "icon-cancel",
97 handler: function () {
98 $jq("#add").dialog("close");
99 }
100 }]
101 });
102 };
103
104 </script>
105 </body>
106 </html>
以上是JSP代码。
感谢其他博主提供的宝贵算法和建议。
时间： 2024-10-13 23:27:30