关于json格式对象返回页面时间字段显示NANA的问题
2018-01-30 09:07
1036 查看
我刚开始时间字段在页面显示时间戳,后来改了一下直接成NANA这种样式,究其原因是,json对象转换会把时间格式的字段转成字符串,所以再以时间格式展示就出问题了,所以我把我的代码贴出来,希望可以帮到谁;
<!DOCTYPE html>
<html>
<!-- Mirrored from www.zi-han.net/theme/hplus/table_jqgrid.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 20 Jan 2016 14:20:02 GMT -->
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>提问管理</title>
<meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
<meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">
<link rel="shortcut icon" href="favicon.ico"> <link href="../../hplus/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
<link href="../../hplus/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
<!-- jqgrid-->
<link href="../../hplus/css/plugins/jqgrid/ui.jqgridffe4.css?0820" rel="stylesheet">
<link href="../../hplus/css/animate.min.css" rel="stylesheet">
<link href="../../hplus/css/style.min862f.css?v=4.1.0" rel="stylesheet">
<style>
/* Additional style to fix warning dialog position */
#alertmod_table_list_2 {
top: 900px !important;
}
</style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
<div class="row">
<div class="col-sm-12">
<div class="ibox ">
<div class="ibox-content">
<div class="ibox-content_1">
<h4>提问人:</h4><input id="usernameID" type="text">
<h4>内容关键字:</h4><input id="descriptionID" type="text">
<button onclick='serch()'>搜索</button>
</div>
<hr>
<div class="jqGrid_wrapper">
<table id="table_list_1"></table>
<div id="pager_list_1"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="../../hplus/js/jquery.min.js?v=2.1.4"></script>
<script src="../../hplus/js/bootstrap.min.js?v=3.3.6"></script>
<script src="../../hplus/js/plugins/peity/jquery.peity.min.js"></script>
<script src="../../hplus/js/plugins/jqgrid/i18n/grid.locale-cnffe4.js?0820"></script>
<script src="../../hplus/js/plugins/jqgrid/jquery.jqGrid.minffe4.js?0820"></script>
<script src="../../hplus/js/content.min.js?v=1.0.0"></script>
<script>
$(document).ready(function(){
var mydata;
$.ajax({
type:'GET', //方式
url:'/quiz/service?pageNumber=1&pageSize=10',
async:false, //是否异步
success:function(data) {
//获得返回json的rows对象
mydata = $.parseJSON(data).rows;
//控制台打印mydata对象
//console.log(mydata);
//遍历rows集合
for(var i=0;i<mydata.length;i++){
var d = new Date(mydata[i].gmtCreate); //根据时间戳生成的时间对象
var date = (d.getFullYear()) + "-" +
(d.getMonth()+1 < 10 ? '0'+(d.getMonth()+1) : d.getMonth()+1) + "-" +
(d.getDate() < 10 ? '0'+(d.getDate()) : d.getDate()) + " " +
(d.getHours() < 10 ? '0'+(d.getHours()) : d.getHours()) + ":" +
(d.getMinutes() < 10 ? '0'+(d.getMinutes()) : d.getMinutes()) + ":" +
(d.getSeconds() < 10 ? '0'+(d.getSeconds()) : d.getSeconds());
//控制台打印转换后的时间字段
// console.log(typeof d)
//将转换后的时间字段赋值给对象
mydata[i].gmtCreate=d
}
}
})
// console.log("2"+mydata);
/*---------------------------jgGride默认设置-----------------------------------*/
$.jgrid.defaults.styleUI="Bootstrap";
$("#table_list_1").jqGrid({data:mydata,datatype:"local",
multiselect: true,height:250,autowidth:true,
shrinkToFit:true,rowNum:14,rowList:[10,20,30],
colNames:["ID","提问人","提问内容","提问时间","图片数量","回复人"],
colModel:[{name:"id",index:"contentType",width:60,sorttype:"content"},
{name:"openid",index:"total",width:80,align:"center",sorttype:"float"},
{name:"description",index:"name",align:"center",width:200},
{name:"gmtCreate",index:"invdate",width:80,align:"center",sorttype:"date",formatter:"date"},
{name:"imageNumber",index:"tax",width:50,align:"center",sorttype:"float"},
{name:"replyName",index:"total",width:80,align:"center",sorttype:"float"}],
sortname : 'id',
sortorder : "desc",
pager:"#pager_list_1",viewrecords:true,caption:"",hidegrid:false,
});
$(window).bind("resize",function(){
var width=$(".jqGrid_wrapper").width();
$("#table_list_1").setGridWidth(width);
})})
//条件查询
function serch(){
var data2;
var username=document.getElementById("usernameID").value;
var description=document.getElementById("descriptionID").value;
$.ajax({
type:'GET', //方式
url:'/quiz/service?pageNumber=1&' +
'pageSize=10&description='+description+'&username='+username+'',
async:false, //是否异步
success:function(data) {
//展示数组内数据
data2 = $.parseJSON(data).rows;
console.log(data);
}
})
/*---------------------------jgGride默认设置-----------------------------------*/
$.jgrid.defaults.styleUI="Bootstrap";
window.refresh=true;
$("#table_list_1").jqGrid('clearGridData'); //清空表格
$("#table_list_1").jqGrid('setGridParam',{ // 重新加载数据
datatype:'local',
data : data2, // newdata 是符合格式要求的需要重新加载的数据
page:1
}).trigger("reloadGrid");
$(window).bind("resize",function(){
var width=$(".jqGrid_wrapper").width();
$("#table_list_1").setGridWidth(width);
});
}
</script>
<script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
</body>
<!-- Mirrored from www.zi-han.net/theme/hplus/table_jqgrid.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 20 Jan 2016 14:20:02 GMT -->
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- SpringMVC中返回Json时间字段格式问题
- 关于Web项目里的给表单验证控件添加结束时间不得小于开始时间的验证方法，日期转换和前台显示格式之间，还有JSON取日期数据格式转换成标准日期格式的问题
- 关于jsp页面显示的时间格式和Oracle数据库中的格式不一样的问题
- 关于JSON数据格式返回时间数据格式化问题
- 关于springmvc 返回json数据null字段的显示问题
- ajax根据ID查询数据库并返回Json格式数据返回js，使用append显示到页面。判断json值为[]或者[[]]的问题。
- json格式的时间显示Date问题解决方法
- 关于Highcharts的x轴密密麻麻的时间格式显示问题解决方法
- 关于txt文本的内容与html页面上显示的内容格式一致的问题
- 关于时间格式yyyy-mm-dd 格式在ie8返回NAN问题
- 对象中含有java.util.Date时使用JSONArray.fromObject时时间显示问题
- java 中arraylist对象 页面显示时间格式
- 获取本地时间时，关于时间的显示格式问题
- 关于FastJson的一些问题的处理（时间问题 ，转换json重用对象引用问）
- WebApi关于配置全局返回Json数据格式时间以及命名小写
- 关于 jsonp 跨域后返回 json 数据格式的问题
- 关于IOS中时间显示格式问题为中文问题(虽然语言设置为英文)
- 艾伟：WCF以Json格式返回对象，客户端以JS调用显示
- 关于返回json数据格式的问题
- 关于ExtJs4提交数据到jsp页面，返回正确的json显示例子。及error:You're trying to decode an invalid JSON String...解决方法