免费的 jQGrid 日期格式化程序并重用网格中的完整数据答案

【问题标题】：Free jQGrid dateformatter and reuse fulldata from grid免费的 jQGrid 日期格式化程序并重用网格中的完整数据
【发布时间】：2017-08-29 05:53:55
【问题描述】：

我在 Free jQgrid 中使用日期格式的列和 datepicker 作为编辑器时遇到问题我用一些日期格式的列定义了一个网格，并且在我的数据中有 Java-Date-objects。

colModel:[ 
    {name:"reminderFrom",       label:"Reminder", 
    formatter:"date",  
    formatoptions:{srcformat:'ISO8601Long', newformat:'d.m.Y'},

    editoptions:{size:20, dataInit:function(el)
    {$(el).datepicker({dateFormat:'dd.mm.yy'});}, 

defaultValue: function($this) { return this.value; }},},
        ....
        ],

当我阅读整个网格数据时

   var fulldata = g.jqGrid('getRowData');

   manipulate it (not the datestrings!) and then want to reuse it in the grid

    g.jqGrid('setGridParam',  {datatype: 'local',  data: fulldata });  
    g.trigger("reloadGrid");
    g.jqGrid('setGridParam',  { datatype: "json"});

日期会改变。
如何使用 dateformatter 重新格式化日期字符串以便在网格中重复使用？

【问题讨论】：

你的结果是什么？
它每次都会根据日期字符串而变化。例如 01.09.2017 变为 28.08.2015 然后（再做一次） 27.08.2010 ...问题似乎是 src= 'ISO8601Long' 的日期格式化程序 - 我认为它应该是 'dmY' 仅用于重新加载。
请始终包含您使用的 jqGrid（或免费 jqGrid）的版本。此外，您在写“Java-Date-objects”时没有包含任何从服务器返回的测试数据。您可以在 Chrome/IE 的开发者工具的网络选项卡中看到从服务器返回的 JSON/XML 数据（按 F12 开始）。此外，重要的是要理解，newformat 中的日期格式必须是 PHP 日期格式，而 jQuery UI 的 dateFormat 取决于您使用的 jQuery UI 的版本（"dd.mm.yy" 用于新的 jQuery UI 或"dd.MM.yyyy" 旧版本）。你使用哪个 jQuery UI？
这里的问题可能是您使用 getRowData 方法获取数据。请检查数组的日期格式 ahter get it - 即在变量 fulldata 中。创建网格时，日期字段的格式可能与初始字段的格式不同
版本是：jquery.ui 1.12.1 jquery 3.1.1 jqgrid 4.13.7 问题是，我从 getRowData 获取数组中显示的日期字符串，并在 setRowData 中使用它。但该列需要“ISO8601Long”作为输入。所以我需要一个解决方案来将'd.m.Y'-String 重新格式化为“ISO8601Long”，或者告诉列它应该使用“d.m.Y”作为输入，或者告诉网格应该给我一个“ISO8601Long”字符串。我也有millis（在一个隐藏的列中）并用JavaScript.Date.toISOString() 尝试过，但是没有用。

标签： jquery datepicker jqgrid date-formatting free-jqgrid

【解决方案1】：

@Oleg 我知道 jsfiddle，但我无法构建示例...

这是一些伪代码 - 该应用程序基于 struts 并与 ajax 和 json 配合使用

Java - 服务器端：

class MyDataBO {
  private String myKey;
  private java.util.Date myDate;
  //...setter/getter
}

class MyGridAction {
  List< MyDataBO> gridDataList;


  public String prepareList(){
     //fill the list with MyDataBO
     return SHOW;  //struts based
  }

  public List< MyDataBO> getGridDataList() {
    return gridDataList;
  }
}

JSP -客户端

<table id="grid"></table>

<script type="text/javascript">
jQuery(document).ready(function() {

    jQuery("#grid").jqGrid({
        datatype: "json",
        mtype: "POST",
        url:    "MyGridAction.getGridDataList",
        jsonReader: {root: "gridDataList"},
        colModel:[
            {name:"myKey",  label:"key", key:true},
            {name:"myDate", label:"date", formatter:"date", formatoptions:{srcformat:'ISO8601Long', newformat:'d.m.Y'}
            ]
 });

</script>

问题出现在这里

<script type="text/javascript">
    var g = jQuery("#grid");

    var fulldata = g.jqGrid('getRowData');

    // do some work on the array

    g.jqGrid('setGridParam',  {datatype: 'local',  data: fulldata });  
    g.trigger("reloadGrid");
    g.jqGrid('setGridParam',  { datatype: "json"});                    
</script>

在 reloadGrid 之后日期改变了...

【讨论】：

我选择了另一种方式 - 分离所有行，将它们放入一个数组中，操作它（对象中的顺序和一些标志）并再次附加它们。