找回密码
 立即注册

QQ登录

只需一步，快速开始

首页 › SpreadJS & GcExcel专区 › 求助中心 › 查看内容
发新帖

ztoit

中级会员

36

主题

87

帖子

944

积分

中级会员

积分
944

微信认证勋章

QQ
最新发帖

[已处理] formatter转换时间格式

ztoit
中级会员   /  发表于：2017-7-4 17:33  /   查看：5878  /  回复：9
blob309344481.png 后台获取到的时间戳，使用了formatter转换时间格式，
blob276292113.png
效果如上，显示NaN，如果将         
   value: function (row) {               return new Date(row['scanDate']);
          }
的注释去掉，到时可以正常显示，但是，该列的排序就不对了


9 个回复

倒序浏览
Clark.Pan讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于：2017-7-4 18:22:12
沙发
您好，能否具体的描述一下排序不对的情况，或者提供一下您的导出的json文件，让我们来重现问题。
点击查看 -->【预览版体验】SpreadJS v16.0 预览版 - 新文件结构
回复 使用道具 举报
ztoit
中级会员   /  发表于：2017-7-5 15:19:31
板凳
你随便用时间戳的数据，用bindColumns，setDataSource的方法制作一个demo，我看看对比一下，看我哪里写的不对。我这边的都写在整个项目里面了，不好剥离出来
回复 使用道具 举报
ztoit
中级会员   /  发表于：2017-7-5 15:21:12
地板
blob114837035.png 点击降序后的效果
回复 使用道具 举报
Clark.Pan讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于：2017-7-5 17:25:58
5#
您好，按照您的要求做了一个demo，请进行参考

dataformatter.zip

1.08 KB, 下载次数: 183
点击查看 -->【预览版体验】SpreadJS v16.0 预览版 - 新文件结构
回复 使用道具 举报
ztoit
中级会员   /  发表于：2017-7-6 14:47:32
6#
  1. <!DOCTYPE html>
  2. <html>

  4.         <head>
  5.                 <title></title>
  6.                 <meta charset="utf-8" />
  7.                 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  8.                 <meta name="spreadjs culture" content="zh-cn" />

  10.                 <link href="js/style/gc.spread.sheets.10.1.0.css" rel="stylesheet" type="text/css" />

  12.                 <script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>

  14.                 <script type="text/javascript" src="js/gc.spread.sheets.all.10.1.0.js"></script>
  15.                 <!--<script type="text/javascript" src="js/interop/gc.spread.excelio.10.1.0.min.js"></script>-->
  16.                 <script type="text/javascript" src="js/resources/zh/gc.spread.sheets.resources.zh.10.1.0.js"></script>
  17.                 <script type="text/javascript" src="js/license.js"></script>
  18.         </head>

  20.         <body>
  21.                 <div id='ss' style='width:100%; height:400px;'></div>
  22.         </body>


  25. </html>
  26. <script type="text/javascript">
  27.         $(document).ready(function() {
  28.                 var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
  29.                 var sheet = spread.getActiveSheet();
  30.                 var datasource = [
  31.                         {name: 'Alice',age: 27,birthday: 1497590553000,position: 'PM'},
  32.                         {name: 'Alice1',age: 27,birthday: 1497604878000,position: 'PM'},
  33.                         {name: 'Alice2',age: 27,birthday: 1497605106000,position: 'PM'},
  34.                         {name: 'Alice3',age: 27,birthday: 1497605107000,position: 'PM'},
  35.                         {name: 'Alice4',age: 27,birthday: 1497605068000,position: 'PM'},
  36.                         {name: 'Alice5',age: 27,birthday: 1497605102000,position: 'PM'},
  37.                         {name: 'Alice6',age: 27,birthday: 1497605049000,position: 'PM'},
  38.                         {name: 'Alice7',age: 27,birthday: 1497605099000,position: 'PM'},
  39.                         {name: 'Alice8',age: 27,birthday: 1497605054000,position: 'PM'},
  40.                         {name: 'Alice9',age: 27,birthday: 1497605080000,position: 'PM'},
  41.                         {name: 'Alice10',age: 27,birthday: 1497605055000,position: 'PM'},
  42.                         {name: 'Alice11',age: 27,birthday: 1497605097000,position: 'PM'}
  43.                 ];
  44.                 // bindColumn one by one
  45.                 var colInfo = [{
  46.                                 name: 'name',
  47.                                 displayName: '姓名'
  48.                         },
  49.                         {
  50.                                 name: 'age',
  51.                                 displayName: 'Age'
  52.                         },
  53.                         {
  54.                                 name: 'birthday',
  55.                                 displayName: '生日',
  56.                                 formatter: 'yyyy-MM-dd hh:mm:ss',
  57.                                 value: function(row) {
  58.                                         return new Date(row.birthday);
  59.                                 }
  60.                         },
  61.                         {
  62.                                 name: 'position',
  63.                                 displayName: 'Position',
  64.                                 isHideFilter:false
  65.                         }
  66.                 ];

  68.                 sheet.autoGenerateColumns = true;
  69.                 sheet.setDataSource(datasource);
  70.                 sheet.bindColumns(colInfo);
  71.                 initSpread(spread);
  72.                 resetDefaultStyle(sheet);
  73.                 setRowFilter(sheet);
  74.                 //表格设置排序，筛选
  75.         function setRowFilter(sheet) {
  76.             var rowCount, colCount;
  77.             rowCount = sheet.getRowCount();
  78.             colCount = sheet.getColumnCount();
  79.             sheet.rowFilter(new GC.Spread.Sheets.Filter.HideRowFilter(new GC.Spread.Sheets.Range(-1, 0, rowCount, colCount)));
  80.             var filter = sheet.rowFilter();
  81.             colInfo.forEach(function (item, index) {
  82.                 if (!item.ishideFilter && item.isHideFilter == false) {
  83.                     filter.filterButtonVisible(index, false);
  84.                 };
  85.             })
  86.         }
  87.                 //初始化表格
  88.                 function initSpread(spread) {
  89.             // give sheet name more space
  90.             spread.options.setTabStripRatio = 0.8;
  91.             spread.options.scrollbarMaxAlign = true;
  92.             spread.options.scrollbarShowMax = true;
  93.             spread.options.grayAreaBackColor = '#e9eef2';
  94.             spread.options.showVerticalScrollbar = true;
  95.             spread.options.newTabVisible = false;
  96.             spread.options.tabStripVisible = false;
  97.             GC.Spread.Common.CultureManager.culture("zh-cn");
  98.         }
  99.                  //重新定义表格默认样式
  100.         function resetDefaultStyle(sheet) {
  101.             // set default style for all cells
  102.             sheet.defaults.rowHeight = 26;
  103.             sheet.defaults.colHeaderRowHeight = 30;
  104.             sheet.defaults.colWidth = 200;
  105.             sheet.options.protectionOptions = {
  106.                 allowFilter: true,
  107.                 allowSort: true,
  108.                 allowResizeRows: true,
  109.                 allowResizeColumns: true,
  110.                 allowEditObjects: true
  111.             };
  112.             sheet.options.isProtected = true;
  113.             var defaultStyle = sheet.getDefaultStyle();
  114.             //                                defaultStyle.backColor  = "#eaf1f9";
  115.             defaultStyle.foreColor = "#666666";
  116.             defaultStyle.font = '9pt "Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif';
  117.             defaultStyle.vAlign = GC.Spread.Sheets.VerticalAlign.center;
  118.             defaultStyle.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
  119.             sheet.setDefaultStyle(defaultStyle);
  120.             sheet.setDefaultStyle(defaultStyle, GC.Spread.Sheets.SheetArea.colHeader);
  121.             sheet.setDefaultStyle(defaultStyle, GC.Spread.Sheets.SheetArea.colHeader);
  122.         }
  123.                

  125.         });
  126. </script>
复制代码

这样的时间排序是不对的
回复 使用道具 举报
ztoit
中级会员   /  发表于：2017-7-6 14:47:40
7#
  1. <!DOCTYPE html>
  2. <html>

  4.         <head>
  5.                 <title></title>
  6.                 <meta charset="utf-8" />
  7.                 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  8.                 <meta name="spreadjs culture" content="zh-cn" />

  10.                 <link href="js/style/gc.spread.sheets.10.1.0.css" rel="stylesheet" type="text/css" />

  12.                 <script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>

  14.                 <script type="text/javascript" src="js/gc.spread.sheets.all.10.1.0.js"></script>
  15.                 <!--<script type="text/javascript" src="js/interop/gc.spread.excelio.10.1.0.min.js"></script>-->
  16.                 <script type="text/javascript" src="js/resources/zh/gc.spread.sheets.resources.zh.10.1.0.js"></script>
  17.                 <script type="text/javascript" src="js/license.js"></script>
  18.         </head>

  20.         <body>
  21.                 <div id='ss' style='width:100%; height:400px;'></div>
  22.         </body>


  25. </html>
  26. <script type="text/javascript">
  27.         $(document).ready(function() {
  28.                 var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
  29.                 var sheet = spread.getActiveSheet();
  30.                 var datasource = [
  31.                         {name: 'Alice',age: 27,birthday: 1497590553000,position: 'PM'},
  32.                         {name: 'Alice1',age: 27,birthday: 1497604878000,position: 'PM'},
  33.                         {name: 'Alice2',age: 27,birthday: 1497605106000,position: 'PM'},
  34.                         {name: 'Alice3',age: 27,birthday: 1497605107000,position: 'PM'},
  35.                         {name: 'Alice4',age: 27,birthday: 1497605068000,position: 'PM'},
  36.                         {name: 'Alice5',age: 27,birthday: 1497605102000,position: 'PM'},
  37.                         {name: 'Alice6',age: 27,birthday: 1497605049000,position: 'PM'},
  38.                         {name: 'Alice7',age: 27,birthday: 1497605099000,position: 'PM'},
  39.                         {name: 'Alice8',age: 27,birthday: 1497605054000,position: 'PM'},
  40.                         {name: 'Alice9',age: 27,birthday: 1497605080000,position: 'PM'},
  41.                         {name: 'Alice10',age: 27,birthday: 1497605055000,position: 'PM'},
  42.                         {name: 'Alice11',age: 27,birthday: 1497605097000,position: 'PM'}
  43.                 ];
  44.                 // bindColumn one by one
  45.                 var colInfo = [{
  46.                                 name: 'name',
  47.                                 displayName: '姓名'
  48.                         },
  49.                         {
  50.                                 name: 'age',
  51.                                 displayName: 'Age'
  52.                         },
  53.                         {
  54.                                 name: 'birthday',
  55.                                 displayName: '生日',
  56.                                 formatter: 'yyyy-MM-dd hh:mm:ss',
  57.                                 value: function(row) {
  58.                                         return new Date(row.birthday);
  59.                                 }
  60.                         },
  61.                         {
  62.                                 name: 'position',
  63.                                 displayName: 'Position',
  64.                                 isHideFilter:false
  65.                         }
  66.                 ];

  68.                 sheet.autoGenerateColumns = true;
  69.                 sheet.setDataSource(datasource);
  70.                 sheet.bindColumns(colInfo);
  71.                 initSpread(spread);
  72.                 resetDefaultStyle(sheet);
  73.                 setRowFilter(sheet);
  74.                 //表格设置排序，筛选
  75.         function setRowFilter(sheet) {
  76.             var rowCount, colCount;
  77.             rowCount = sheet.getRowCount();
  78.             colCount = sheet.getColumnCount();
  79.             sheet.rowFilter(new GC.Spread.Sheets.Filter.HideRowFilter(new GC.Spread.Sheets.Range(-1, 0, rowCount, colCount)));
  80.             var filter = sheet.rowFilter();
  81.             colInfo.forEach(function (item, index) {
  82.                 if (!item.ishideFilter && item.isHideFilter == false) {
  83.                     filter.filterButtonVisible(index, false);
  84.                 };
  85.             })
  86.         }
  87.                 //初始化表格
  88.                 function initSpread(spread) {
  89.             // give sheet name more space
  90.             spread.options.setTabStripRatio = 0.8;
  91.             spread.options.scrollbarMaxAlign = true;
  92.             spread.options.scrollbarShowMax = true;
  93.             spread.options.grayAreaBackColor = '#e9eef2';
  94.             spread.options.showVerticalScrollbar = true;
  95.             spread.options.newTabVisible = false;
  96.             spread.options.tabStripVisible = false;
  97.             GC.Spread.Common.CultureManager.culture("zh-cn");
  98.         }
  99.                  //重新定义表格默认样式
  100.         function resetDefaultStyle(sheet) {
  101.             // set default style for all cells
  102.             sheet.defaults.rowHeight = 26;
  103.             sheet.defaults.colHeaderRowHeight = 30;
  104.             sheet.defaults.colWidth = 200;
  105.             sheet.options.protectionOptions = {
  106.                 allowFilter: true,
  107.                 allowSort: true,
  108.                 allowResizeRows: true,
  109.                 allowResizeColumns: true,
  110.                 allowEditObjects: true
  111.             };
  112.             sheet.options.isProtected = true;
  113.             var defaultStyle = sheet.getDefaultStyle();
  114.             //                                defaultStyle.backColor  = "#eaf1f9";
  115.             defaultStyle.foreColor = "#666666";
  116.             defaultStyle.font = '9pt "Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif';
  117.             defaultStyle.vAlign = GC.Spread.Sheets.VerticalAlign.center;
  118.             defaultStyle.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
  119.             sheet.setDefaultStyle(defaultStyle);
  120.             sheet.setDefaultStyle(defaultStyle, GC.Spread.Sheets.SheetArea.colHeader);
  121.             sheet.setDefaultStyle(defaultStyle, GC.Spread.Sheets.SheetArea.colHeader);
  122.         }
  123.                

  125.         });
  126. </script>
复制代码

这样的时间排序是不对的
回复 使用道具 举报
Clark.Pan讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于：2017-7-6 16:47:22
8#
ztoit 发表于 2017-7-6 14:47
这样的时间排序是不对的

您好，您的问题咨询了一下我们的研发，原因是这样的，筛选的实现原因其实是通过值得交换来实现的，所以您在实现convert时需要同时实现setValue，不然实现中无法知道该如何set，导致筛选后值不变。根据您提供的代码，我们进行了修改，您可以进行参考：

  1. <!DOCTYPE html>
  2. <html>

  4.         <head>
  5.                 <title></title>
  6.                 <meta charset="utf-8" />
  7.                 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  8.                 <meta name="spreadjs culture" content="zh-cn" />

  10.                 <link href="css/gc.spread.sheets.10.1.0.css" rel="stylesheet" type="text/css" />

  12.                 <script src="http://demo.gcpowertools.com.cn/SpreadJS/TutorialSample/external/external/jquery-1.8.2.min.js" type="text/javascript"></script>

  14.                 <script type="text/javascript" src="js/gc.spread.sheets.all.10.1.0.min.js"></script>
  15.                 <!--<script type="text/javascript" src="js/interop/gc.spread.excelio.10.1.0.min.js"></script>-->
  16.                 <!--<script type="text/javascript" src="js/resources/zh/gc.spread.sheets.resources.zh.10.1.0.js"></script>-->
  17.                 <script type="text/javascript" src="js/license.js"></script>
  18.         </head>

  20.         <body>
  21.                 <div id='ss' style='width:100%; height:400px;'></div>
  22.         </body>


  25. </html>
  26. <script type="text/javascript">
  27.         $(document).ready(function() {
  28.                 var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
  29.                 var sheet = spread.getActiveSheet();
  30.                 var datasource = [
  31.                         {name: 'Alice',age: 27,birthday: 1497590553000,position: 'PM'},
  32.                         {name: 'Alice1',age: 27,birthday: 1497604878000,position: 'PM'},
  33.                         {name: 'Alice2',age: 27,birthday: 1497605106000,position: 'PM'},
  34.                         {name: 'Alice3',age: 27,birthday: 1497605107000,position: 'PM'},
  35.                         {name: 'Alice4',age: 27,birthday: 1497605068000,position: 'PM'},
  36.                         {name: 'Alice5',age: 27,birthday: 1497605102000,position: 'PM'},
  37.                         {name: 'Alice6',age: 27,birthday: 1497605049000,position: 'PM'},
  38.                         {name: 'Alice7',age: 27,birthday: 1497605099000,position: 'PM'},
  39.                         {name: 'Alice8',age: 27,birthday: 1497605054000,position: 'PM'},
  40.                         {name: 'Alice9',age: 27,birthday: 1497605080000,position: 'PM'},
  41.                         {name: 'Alice10',age: 27,birthday: 1497605055000,position: 'PM'},
  42.                         {name: 'Alice11',age: 27,birthday: 1497605097000,position: 'PM'}
  43.                 ];
  44.                 // bindColumn one by one
  45.                                 function fromOADate(date) {
  46.                                         var oaDateReg = new RegExp('^/OADate\\(([-+]?(\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)\\)/\\s*);
  47.                                         if (typeof date === "string" && oaDateReg.test(date)) {
  48.                                                 var oadate = parseFloat(date.match(oaDateReg)[1]);
  49.                                                 var ms = (oadate * 86400000 * 1440 - 25569 * 86400000 * 1440 + new Date((oadate - 25569) * 86400000).getTimezoneOffset() * 86400000 ) / 1440;
  50.                                                 return new Date(ms);
  51.                                         }else{
  52.                                                 return date;
  53.                                         }
  54.                                 }

  56.                 var colInfo = [{
  57.                                 name: 'name',
  58.                                 displayName: '姓名'
  59.                         },
  60.                         {
  61.                                 name: 'age',
  62.                                 displayName: 'Age'
  63.                         },
  64.                         {
  65.                                 name: 'birthday',
  66.                                 displayName: '生日',
  67.                                 formatter: 'yyyy-MM-dd hh:mm:ss',
  68.                                 value: function(row,value) {
  69.                                    if (arguments.length === 1) {
  70.                                                                                 //getValue
  71.                                                                                 return new Date(row.birthday);
  72.                                                                         } else {
  73.                                                                                 //setValue
  74.                                                                                 row.birthday = fromOADate(value).valueOf();
  75.                                                                         }

  77.                                                                 }

  79.                         },
  80.                         {
  81.                                 name: 'position',
  82.                                 displayName: 'Position',
  83.                                 isHideFilter:false
  84.                         }
  85.                 ];

  87.                 sheet.autoGenerateColumns = true;
  88.                 sheet.setDataSource(datasource);
  89.                 sheet.bindColumns(colInfo);
  90.                 initSpread(spread);
  91.                 resetDefaultStyle(sheet);
  92.                 setRowFilter(sheet);
  93.                 //表格设置排序，筛选
  94.                                 function setRowFilter(sheet) {
  95.                                         var rowCount, colCount;
  96.                                         rowCount = sheet.getRowCount();
  97.                                         colCount = sheet.getColumnCount();
  98.                                         sheet.rowFilter(new GC.Spread.Sheets.Filter.HideRowFilter(new GC.Spread.Sheets.Range(0, 0, rowCount, colCount)));
  99.                                         var filter = sheet.rowFilter();
  100.                                         /*colInfo.forEach(function (item, index) {
  101.                                                 if (!item.ishideFilter && item.isHideFilter == false) {
  102.                                                         filter.filterButtonVisible(index, false);
  103.                                                 };
  104.                                         })*/7
  105.                                 }
  106.                                 //初始化表格
  107.                                
  108.                                 function initSpread(spread) {
  109.                                         // give sheet name more space
  110.                                         spread.options.setTabStripRatio = 0.8;
  111.                                         spread.options.scrollbarMaxAlign = true;
  112.                                         spread.options.scrollbarShowMax = true;
  113.                                         spread.options.grayAreaBackColor = '#e9eef2';
  114.                                         spread.options.showVerticalScrollbar = true;
  115.                                         spread.options.newTabVisible = false;
  116.                                         spread.options.tabStripVisible = false;
  117.                                         GC.Spread.Common.CultureManager.culture("zh-cn");
  118.                                 }
  119.                                 //重新定义表格默认样式
  120.                                 function resetDefaultStyle(sheet) {
  121.                                         // set default style for all cells
  122.                                         sheet.defaults.rowHeight = 26;
  123.                                         sheet.defaults.colHeaderRowHeight = 30;
  124.                                         sheet.defaults.colWidth = 200;
  125.                                         sheet.options.protectionOptions = {
  126.                                                 allowFilter: true,
  127.                                                 allowSort: true,
  128.                                                 allowResizeRows: true,
  129.                                                 allowResizeColumns: true,
  130.                                                 allowEditObjects: true
  131.                                         };
  132.                                 //        sheet.options.isProtected = true;
  133.                                         var defaultStyle = sheet.getDefaultStyle();
  134.                                         //                                defaultStyle.backColor  = "#eaf1f9";
  135.                                         defaultStyle.foreColor = "#666666";
  136.                                         defaultStyle.font = '9pt "Helvetica Neue", Helvetica, Microsoft Yahei, Hiragino Sans GB, WenQuanYi Micro Hei, sans-serif';
  137.                                         defaultStyle.vAlign = GC.Spread.Sheets.VerticalAlign.center;
  138.                                         defaultStyle.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
  139.                                         sheet.setDefaultStyle(defaultStyle);
  140.                                         sheet.setDefaultStyle(defaultStyle, GC.Spread.Sheets.SheetArea.colHeader);
  141.                                         sheet.setDefaultStyle(defaultStyle, GC.Spread.Sheets.SheetArea.colHeader);
  142.                                 }
  143.                

  145.         });
  146. </script>
复制代码
点击查看 --&gt;【预览版体验】SpreadJS v16.0 预览版 - 新文件结构
回复 使用道具 举报
ztoit
中级会员   /  发表于：2017-7-6 17:13:22
9#
tia blob489833373.png 调试报错
回复 使用道具 举报
Clark.Pan讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于：2017-7-6 17:21:00
10#
不好意思，发现论坛帖代码的时候把代码中的部分符号搞不见了，我将代码附件上传您再看看。
以下是测试截图：
image.png599443969.png
image.png785371093.png

dataformatter_1.zip

2.1 KB, 下载次数: 187
点击查看 --&gt;【预览版体验】SpreadJS v16.0 预览版 - 新文件结构
回复 使用道具 举报
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册
产品与服务
活字格低代码平台
Wyn 商业智能软件
SpreadJS纯前端表格控件
技术服务体系
技术博客
低代码技术
客户与案例
典型客户
成功案例
用户访谈
合作与生态
合作伙伴网络
葡萄城市场
葡萄城与国产化
活字格用友客开工具
品牌活动
葡萄城公开课
品牌战略发布会
赋能开发者高峰论坛
企业级低代码发展研讨会
企业级低代码应用大赛
表格技术研讨会
了解葡萄城
葡萄城简介
愿景使命
研发与创新
荣誉奖项
加入我们
联系方式
联系我们
400-657-6008

葡萄城社区二维码

关注“葡萄城社区”

赋能开发者

西安葡萄城软件有限公司
专业的软件开发技术和低代码平台提供商

陕ICP备2020018819号  |   陕公网安备：61019002000258  |   隐私政策  |   网站地图  

邮箱： info.xa@grapecity.com  |  © 2024 葡萄城软件，保留所有权利

Archiver| 手机版| 小黑屋|

返回顶部