【EasyUI】日期格式化

本文经过了测试，解决getFullyear() is not a function等问题

效果如下：

首先：

Oracle中字段设置为DATE，MySQL中设置为DATETIME，MyBatis中会自动映射为TimeStamp；

其次：

model实体类中字段使用sql.Timestamp，如果设置为DATE类型，那么时分秒会显示为00:00:00这样显然没有什么意义。

 function formatterdate(val, row) {

     if (val != null) {

         var date = new Date(val);

         return date.getFullYear() + '-' + (date.getMonth() + 1) + '-'

                 + date.getDate();

     }

 }

 /**

  * 格式化日期（不含时间）

  */

 function formatterdate1(val, row) {

     if (val != null) {

         var date = new Date(val);

         return date.getFullYear()

                 + "-"// "年"

                 + ((date.getMonth() + 1) > 10 ? (date.getMonth() + 1) : "0"

                         + (date.getMonth() + 1)) + "-"// "月"

                 + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate());

     }

 }

 /**

  * 格式化日期（含时间"00:00:00"）

  */

 function formatterdate2(val, row) {

     if (val != null) {

         var date = new Date(val);

         return date.getFullYear()

                 + "-"// "年"

                 + ((date.getMonth() + 1) > 10 ? (date.getMonth() + 1) : "0"

                         + (date.getMonth() + 1)) + "-"// "月"

                 + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate())

                 + " " + "00:00:00";

     }

 }

 /**

  * 格式化去日期（含时间）

  */

 function formatterdate3(val, row) {

     if (val != null) {

         var date = new Date(val);

         return date.getFullYear()

                 + "-"// "年"

                 + ((date.getMonth() + 1) > 10 ? (date.getMonth() + 1) : "0"

                         + (date.getMonth() + 1))

                 + "-"// "月"

                 + (date.getDate() < 10 ? "0" + date.getDate() : date.getDate())

                 + " "

                 + (date.getHours() < 10 ? "0" + date.getHours() : date

                         .getHours())

                 + ":"

                 + (date.getMinutes() < 10 ? "0" + date.getMinutes() : date

                         .getMinutes())

                 + ":"

                 + (date.getSeconds() < 10 ? "0" + date.getSeconds() : date

                         .getSeconds());

     }

 }

以上是Common.js，引入到需要使用的jsp文件中。

 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

 <%

 String path = request.getContextPath();

 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

 %>

 <!DOCTYPE html>

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

     <title>File Info</title>

     <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/default/easyui.css">

     <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/icon.css">

     <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/themes/color.css">

     <link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.1/demo/demo.css">

     <link rel="stylesheet" type="text/css" href="../css/info.css">

     <script type="text/javascript" src="../jquery-easyui-1.4.1/jquery.min.js"></script>

     <script type="text/javascript" src="../jquery-easyui-1.4.1/jquery.easyui.min.js"></script>

     <script type="text/javascript" src="../jquery-easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>

     <!-- <script type="text/javascript" src="../js/jquery-1.8.0.min.js"></script> -->

     <script type="text/javascript" src="../js/Common.js"></script>

 </head>

 <body>

     <!-- 显示文件信息的表格 -->

     <table id="dg"  class="easyui-datagrid" style="height: 470px;"

             url="findAll.do"

             toolbar="#toolbar" pagination="true"

             rownumbers="true" fitColumns="true" singleSelect="true"

             data-options="fit:false,border:false,pageSize:5,pageList:[5,10,15,20]" >

         <thead>

             <tr>

                 <!-- 此处必须和实体类字段一致 -->

                 <th field="filename" width="50">文件名</th>

                 <th field="filepath" width="50">文件路径</th>

                 <th field="updatedate" width="50">上传时间</th>

             </tr>

         </thead>

     </table>

     <table id="tdList"></table>

     <script type="text/javascript">

     var $jq = jQuery.noConflict();

     $jq(function () {

         $jq("#tdList").datagrid({

             url: "findAll.do",

             title: "数据字典列表",

             loadMsg: '正在加载信息...',

             width: "100%",

             idField: "Id",

             fitColumns: true,

             pagination: true,

             pageSize: 10,

             pageList: [10, 20, 35, 50],

             singleSelect: true,

             rownumbers: true,

             columns: [[

                     { field: 'filename', title: '文件名', width: 120 },

                     { field: 'filepath', title: '文件路径', width: 80 },

                     {

                         field: 'updatedate', title: '上传时间', width: 80,

                         formatter : formatterdate3

                     }

             ]],

             toolbar: [{

                 id: 'add',

                 text: '添加',

                 iconCls: 'icon-add',

                 handler: add

             }],

             onLoadSuccess: function (data) {

                 if (!data.rows) {

                     var body = $jq(this).data().datagrid.dc.body2;

                     body.find('table tbody').append('<tr><td width="' + body.width() + '" style="height: 25px; text-align: center;">没有数据</td></tr>');

                 }

             }

         });

     });

     function add(){

         $jq("#add").dialog({

             title: "添加数据字典类别",

             collapsible: true,

             minimizable: true,

             maximizable: true,

             resizable: true,

             width: 400,

             height: 260,

             buttons: [{

                 text: "保存",

                 iconCls: "icon-add",

                 handler: function () {

                     $jq("#add form").submit();

                 }

             }, {

                 text: "取消",

                 iconCls: "icon-cancel",

                 handler: function () {

                     $jq("#add").dialog("close");

                 }

             }]

         });

     };

 </script>

 </body>

 </html>

以上是JSP代码。

感谢其他博主提供的宝贵算法和建议。

【EasyUI】日期格式化的更多相关文章

jquery easyUI 日期格式化，DateBox只显示年
jquery easyUI 日期格式化,DateBox只显示年 >>>>>>>>>>>>>>>>> ...
MVC EasyUI 时间格式化
用 return Json(dr, JsonRequestBehavior.AllowGet); 会返回一个json 数据格式,在用 EasyUI 输出表格内容时会遇到时间输出不是我们想要的格式, ...
jquery easyUi columns日期格式化
jquery easyUi columns日期格式化方法一 Date.prototype.format = function (format) { var o = { "M+" ...
C# DateTime日期格式化
在C#中DateTime是一个包含日期.时间的类型,此类型通过ToString()转换为字符串时,可根据传入给Tostring()的参数转换为多种字符串格式. 目录 1. 分类 2. 制式类型 3. ...
Json.net日期格式化
1. 全局设置,可以在App_Global中配置 JsonSerializerSettings setting = new JsonSerializerSettings(); JsonConvert. ...
分享自己写的JS版日期格式化和解析工具类，绝对好用！
前言本来想模仿Java里面的SimpleDateFormat()对象的,但是感觉这样用起来不方便,所以还是直接写成单独的方法算了. 原文链接日期格式化使用说明 formatDate(date, ...
Oracle 英文非标准格式日期格式化
最近在处理一张表的时候,需要按照日期排序,日期字段中日期的格式有两种. 格式一:07-Aug-2015 格式二:10/28/16 日期转化及格式化sql语句: select to_date('07-A ...
Sql Server 日期格式化函数
Sql Server 中一个非常强大的日期格式化函数Select CONVERT(varchar(100), GETDATE(), 0): 05 16 2006 10:57AMSelect CONVE ...
django 过滤器、日日期格式化参数
转载:http://blog.csdn.net/xyp84/article/details/7945094 django1.4 html页面从数据库中读出DateTimeField字段时,显示的时间格 ...
161226、js日期格式化
JavaScript Date format(js日期格式化) 方法一:// 对Date的扩展,将 Date 转化为指定格式的String // 月(M).日(d).小时(h).分(m).秒(s).季 ...

随机推荐

C#进阶系列——一步一步封装自己的HtmlHelper组件：BootstrapHelper
前言:之前学习过很多的Bootstrap组件,博主就在脑海里构思:是否可以封装一套自己Bootstrap组件库呢.再加上看到MVC的Razor语法里面直接通过后台方法输出前端控件的方式,于是打算仿照H ...
如何在HoloLens中创建一个2D的Hello World程序
注:本文提及到的代码示例下载地址 > How to build an "Hello World" 2D app in HololLens. HoloLens 是微软的一款MR ...
【WPF】WPF 布局
1.window 类继承自 ContentControl 所以内部只能有一个元素2.遵循原则: 不应显示的设置元素(控件)尺寸,可以通过设置最大最小尺寸来限制大小 ...
highcharts .net导出服务和两种导出方式
highcharts 的Net导出服务 GitHub上整理的https://github.com/imclem/Highcharts-export-module-asp.net 引用两个程序集 sh ...
sql server生成递归日期
WITH Date AS ( SELECT CAST('2008-08-01' AS DATETIME) da UNION ALL FROM Date WHERE da < '2008-08-2 ...
VLC 资料整理
libvlc_media_t的创建创建libvlc_media_t有两种方法:libvlc_media_new_path()和libvlc_media_new_location().简单描述一下这两 ...
读《单页web应用》-回顾作用域
js中没有块级作用域,只有全局作用域和函数作用域.全局变量可以在任何地方访问,局部变量只能在声明它的地方访问. var a=1; function func(){ var a=2; } console ...
【编码】_C#中编码名称（Name）与页面标识（CodePage）的关系_编码gb2312的获取
在写C#代码时,发现VS提供没有直接提供gb2312的中文编码, 所以,需要找到对应编码名称的codepage来调用想要的编码方式. 下面是微软编程提供的所有编码信息,包括编码名称,编码代码页标识符, ...
封装一个函数获取匹配特定的css选择符
function $$(selector,context){ context=context||document; var elements=context.querySelectorAll(sele ...
JavaScript对象篇之hasOwnProperty
判断一个属性是定义在对象本身而不是继承自原型链,我们需要使用从 Object.prototype 继承而来的 hasOwnProperty 方法.hasOwnProperty 方法是 Javascri ...

【EasyUI】 日期格式化

【EasyUI】 日期格式化的更多相关文章

随机推荐

热门专题

【EasyUI】日期格式化

【EasyUI】日期格式化的更多相关文章