一点小问题
<%@page contentType="text/html;charset=utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图书后台管理</title>
<link rel="stylesheet" href="css/index.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<script type="text/javascript" src="/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="/js/sweetalert2.js"></script>
<script type="text/javascript" src="/js/validation.js"></script>
<script type="text/javascript">
function del(obj){
var id = $(obj).attr("data-id");
swal.fire({
title:"确认要删除这本书么",
showCancelButton: true,
confirmButtonText:"是",
cancelButtonText:"否",
}).then(function(result){
if(result.value == true){
$.ajax({
"url":"/books",
"type":"get",
"data":{"id":id,"method":"delete"},
"datatype":"json",
"success":function(data){
var json = JSON.parse(data);
if(json.result == "ok"){
window.location.reload();
}else{
swal.fire({
title:json.result,
})
}
}
})
}
})
}
function search(input){
var val = $(searchContent).val();
if($.trim(val) == ""){
$(searchContent).attr("placeholder","内容不可以为空");
return;
}
$('#tbody1').empty();
$.ajax({
"url":"/books",
"type":'get',
"data":{"data":val,"method":"search"},
"datatype": "json",
"success":function(data){
var json = JSON.parse(data);
console.log(json);
if(json.result == "noid"){
$(searchContent).val("该分类不存在");
}else{
$(searchContent).val("");
var html;
$.each(json,function(index,book){
var price = book.price + "";
console.log(typeof price);
html=html+ "<tr id = 'tr1'>"
+ "<td> " + (index+1) +"</td>"
+ "<td> " + book.id + " </td>"
+ "<td>" + book.bname +"</td>"
+"<td>" + val + "</td>"
+ "<td><fmt:formatNumber pattern='$0.00' value= "+ price + "></fmt:formatNumber></td>"
+ "<td><img src=" + book.cover + " Style='width:130px;height:150px'></td>"
+ "<td><a href='/books?method=update&bookId="+ book.id+"'>修改  </a>"
+ "<a href='javascript:void(0)' data-id="+book.id+ " onclick='del(this)'>删除</a></td> "
;
});
$('#tbody1').html(html);
}
}
})
}
</script>
</head>
<body>
<header>
<div class="container">
<nav>
<a href="/booklist" >图书信息管理</a>
</nav>
<nav>
<a href="/category?method=list" >分类管理</a>
</nav>
</div>
</header>
<section class="banner">
<div class="container">
<div>
<h1>图书管理系统</h1>
<p>图书信息管理</p>
</div>
</div>
</section>
<section class="main">
<div class="container">
<form class="javascript:void(0)" action="javascript:void(0)" method="post">
<div class="form-group" style="float: right;">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-primary" onclick="search()">查询</button>
</div>
</div>
<div class="form-group" style="float: right;width: 300px;">
<div class="col-sm-8">
<input name="searchContent" class="form-control" id="searchContent"
placeholder="输入要查询的分类" style="width: 250px">
</div>
</div>
</form>
</div>
<div class="container">
<table class="table table-striped">
<thead>
<tr>
<th>序号</th>
<th>图书编号</th>
<th>图书名称</th>
<th>分类</th>
<th>价格</th>
<th>图书封面</th>
<th>操作</th>
</tr>
</thead>
<tbody id="tbody1">
<c:forEach items="${bookPage.pageData }" var="book" varStatus="idx">
<tr id="tr1">
<td>${idx.index +1 }</td>
<td>${book.id }</td>
<td>${book.bname }</td>
<c:choose>
<c:when test="${book.category == 'ca001' }"><td>Arts & Photography</td></c:when>
<c:when test="${book.category == 'ca002' }"><td>History</td></c:when>
<c:when test="${book.category == 'ca003' }"><td>Business & Money</td></c:when>
<c:otherwise><td>未知的图书类型</td></c:otherwise>
</c:choose>
<td><fmt:formatNumber pattern="$0.00" value="${book.price }"></fmt:formatNumber> </td>
<td><img src="${book.cover }" Style="width:130px;height:150px"></td>
<td>
<a href="/books?method=update&bookId=${book.id }">修改</a>
<a href="javascript:void(0)" data-id="${book.id }" onclick="del(this)">删除</a>
</td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
</section>
<section class="page">
<div class="container">
<div id="fatie">
<a href="/books?method=add"><button>新建</button></a>
</div>
</div>
</section>
<div class="page-nav">
<ul>
<li><a href="/booklist?p=1">首页</a></li>
<c:if test="${bookPage.hasPreviousPage == true }">
<li><a href="/booklist?p=${bookPage.page -1 }">上一页</a></li>
</c:if>
<c:forEach begin="1" end="${bookPage.totalPages }" var ="pno" step="1">
<li><span ${pno==bookPage.page?"class='first-page'":""}>
<a href="/booklist?p=${pno}">${pno }
</a>
</span></li>
</c:forEach>
<c:if test="${bookPage.hasNextPage ==true}">
<li><a href="/booklist?p=${bookPage.page +1 }">下一页</a></li>
</c:if>
<li><a href="/booklist?p=${bookPage.totalPages}$">尾页</a></li>
</ul>
</div>
<footer>
Xiaoqing Ding-2020
</footer>
</body>
</html>在第二个ajax请求处:
html 里面
+ "<td><fmt:formatNumber pattern='$0.00' value= "+ price + "></fmt:formatNumber></td>"
这句话一直过不了
报错
我刚开始放入的 是 book.price这个变量, 格式是 Number 报这个错误,我认为是格式的问题,就建了一个变量 price ,格式是string, 也还是报这个错误。 除非我手动把 + price + 改成+ 3.33+ 这样才能读出来。 问下这个要怎么改呢? 是什么原因呢?
正在回答 回答被采纳积分+1
同学你好,1、<fmt:formatNumber>是jstl标签,其实jstl就是用来替换Java代码的,避免代码和html标记混合在一起。
2、这里老师测试了一下,确实在js中直接使用jstl标签时,会有一些拼接上的问题,这是因为这里是js中用的拼接后的内容,直接解析展示到页面中,但是jstl是直接使用在jsp页面中,所以会出现一些问题。
老师尝试当把拼接的内容,放在作用域中直接使用el表达式来获取,暂时可以解决这个问题,比如:


在页面中可以直接解析:

3、这里暂时不建议直接在js中使用jstl标签,在js中,其实也可以使用js中的方法来格式化输出价格,同学如果有兴趣可以去了解一下。
4、当前作业中,在js这个ajax中,同学先暂时写为+ "<td>" + parseFloat(book.price)+ "</td>"这样的格式。
如果我的回答解决了你的疑惑,请采纳!祝学习愉快!
同学你好,1、根据同学的描述,问题在第二个ajax请求处,此时只有当点查询时,才会触发这个ajax请求中的内容,所以同学说的-->但无论哪一个进去都报同一个错误,而且都不需要点查询,直接刷新就报错。 老师并没有理解。
报的同一个错误,是指一样的NumberFormatException 错误吗?
2、parseFloat(book.price)可以正常的将获取到的内容转为数值Number类型,此时可以直接使用如下<fmt:formatNumbe>标签来读取输出一下,比如:
"<td><fmt:formatNumber pattern='$0.00' value= "+ parseFloat(book.price)+ "></fmt:formatNumber></td>"
同学可以暂时去掉 console.log这些内容。
Ps: 建议同学清理缓存后再来尝试重新启动一下服务,再来试试。
继续加油 祝:学习愉快~
同学你好,1、NumberFormatException -->数字格式转换异常,当试图将一个String转换为指定的数字类型,而该字符串确不满足数字类型要求的格式时,抛出这个异常。
2、同学尝试先不使用<fmt:formatNumber>标签,先尝试直接使用${book.price}查看能否正常输出价格的内容,如果不能正常输出,同学可以检查一下传递过来的数据,如果可以正常输出,同学可以再次添加上<fmt:formatNumber>标签来试试。
3、问一下同学这里的价格是可以正常输出的吗

如果可以,同学就可以排查一下是传参的问题了。
如果我的回答解决了你的疑惑,请采纳!祝学习愉快!
- 参与学习 人
- 提交作业 9410 份
- 解答问题 16556 个
综合就业常年第一,编程排行常年霸榜,无需脱产即可学习,北上广深月薪过万 无论你是未就业的学生还是想转行的在职人员,不需要基础,只要你有梦想,想高薪
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星