As the title, the ajax request gets json data to fill the HTML page, and encounters a problem that the time cannot be formatted.
Since it is in js, the fmt tag reference is invalid, and many js time formatting functions have been searched on the Internet, but they are invalid.
Since I was using spring MVC, I thought of annotations later, and the way to do it is to use annotations on the time field of the entity class of the application:
@DateTimeFormat(pattern = "yyyy-MM-dd hh:mm:ss")//Annotation can inject time in this format
@JSONField(format = "yyyy-MM-dd hh:mm:ss") //default via ajax After the json is parsed, it is converted into the format
private Date upTime;// the time of listing',
then the js page does not need to be processed:
//Get paging function
function getPage(obj,num,info) {
$.ajax({
type: "GET",//Request type
url: path+"/getCardsPage",//Request url
data: {id: obj ,index:num,info:info},//Request parameter
dataType: "json",//The data type returned by the ajax interface (request url)
async: false , //true asynchronous, false synchronous
success: function (data) { //data: return data (json object)
$("#storyBooksssss").html("");
var div = "";
for (var i = 0; i < data.newList.length; i++) {
div+= "<div class=\"product_storyList_content_left\"><img src="+path+"/static/rootWeb/images/"+data.newList[i].titleImg+" alt=\"point card list\"/></div>" +
" <div class=\"product_storyList_content_right\"><ul>"+
" <li class=\"product_storyList_content_dash\"><a href=\"#\" class=\"blue_14\">"+data.newList[i].gName+"</a></li>"+
"<li>顾客评分：<img src="+path+"/static/rootWeb/images/star_red.gif><img src="+path+"/static/rootWeb/images/star_red.gif alt='star'/><img src="+path+"/static/rootWeb/images/star_red.gif alt='star'/><img src="+path+"/static/rootWeb/images/star_red.gif alt='star'/><img src="+path+"/static/rootWeb/images/star_red.gif alt='star'/></li>"+
"<li>好评率：" + data.newList[i].praiseRate + "%</li>"+
"<li>点卡名称：" + data.newList[i].cName + "</li>"+
" <li>上架时间：" + data.newList[i].upTime + "</li>"+
"<li>" + data.newList[i].cInfo + "</li>"+
"<li><dl class=\"product_content_dd\"> <dd> </dd>" +
"<dd><a href="+path+"/static/toCardView/"+ data.newList[i].cId + "/"+data.newList[i].gid+">"+
"<img src="+path+"/static/rootWeb/images/product_buy_01.gif></a></dd>"+
" <dd class=\"footer_dull_red\"><span>实际售价：￥"+data.newList[i].price+"</span></dd>"+
"<dd class=\"product_content_delete\"><span>原价：￥"+data.newList[i].iniPrice+"</span></dd>"+
"</dl> </li> </ul> </div><div class=\"product_storyList_content_bottom\"></div>";
}
div+="<input type='hidden' id='totalPageCount' value="+data.totalPageCount+">";
$("#storyBooksssss").html(div);
$("#pageNo").html("");
$(".page-bar").remove();//错误点，必须加上这句清空
var page="<div class='page-bar'>"+
"<p class='page-num-ul'>"+
"<span> 共"+data.totalCount+"条记录</span>"+
"<span> "+data.currPageNo+"/"+data.totalPageCount+"页</span>";
if(data.currPageNo>1){
page+="<a href=\"javascript:;\" id='1' class='first' > 首页</a>"+
"<a href=\"javascript:;\" class='pre' id='"+(data.currPageNo-1)+"'> 上一页</a>";
}
if(data.currPageNo < data.totalPageCount ){
page+="<a href=\"javascript:;\" class='next' id='"+(data.currPageNo+1)+"'> 下一页</a>"+
"<a href=\"javascript:;\" class='last' id='"+data.totalPageCount+"'> 最后一页</a>";
}
page+="<span class='page-go-form'><label> 跳转至</label>"+
"<input type='text' name='inputPage' id='inputPage' class='page-key' />页"+
"<button type='button' class='page-btn' id='page-btn'>GO</button>"+
"</span></p></div>"; } }); } alert("Failed to load paging information!"); error: function (data) {//When accessing, 404, 500 and other non-200 error states Code },
$("#pageNo").html(page);
Effect:
