添加新的商品信息

最新推荐文章于 2023-09-06 19:37:49 发布

昱晟168

最新推荐文章于 2023-09-06 19:37:49 发布

阅读量377

点赞数 1

分类专栏：项目文章标签： java 开发语言

本文链接：https://blog.csdn.net/weixin_47267628/article/details/125070382

版权

项目专栏收录该内容

7 篇文章 0 订阅

订阅专栏

修改商品信息

注意是：由于商品图片是使用ajax请求发送的，在添加和修改时都需要使用到，所以需要定义saveFileName用于保存图片名称，在修改商品信息时，用户有可能对象商品信息进行修改，也有可能不进行修改，所以我们需要在商品添加和修改时保存后将商品saveFileName重新赋值为""空字符串

商品修改第一步：根据`ID`查询信息并且在页面回显数据

1.获取要修改商品的ID

<button type="button" onclick="updateOne(${p.pId})"  class="btn btn-default">修改</button>

<%--    发送修改请求携带ID --%>
function updateOne(pId) {
    location.href = "${pageContext.request.contextPath}/prod/one.action?pId="+pId;
}

2.controller层接收请求，调用service层查询数据

   // 修改商品信息第一步：查询商品信息
    @RequestMapping("/one")
    public String oneUpdate(int pId,Model model){
        System.out.println(pId);
        // 根据ID查询商品信息
        ProductInfo info = null;
        try {
            info = service.prodInfoById(pId);
        } catch (Exception e) {
            e.printStackTrace();
        }
        model.addAttribute("info",info);
        return "update";
    }

servcie接口

    // 根据ID查询商品信息
    ProductInfo prodInfoById(Integer id);

service接口实现类

    // 修改商品信息
    @Override
    public int updateProdInfo(ProductInfo productInfo) {
        return mapper.updateByPrimaryKey(productInfo);
    }

第二步：由于controller层跳转到指定修改页面update.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title></title>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css" />
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/addBook.css" />
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath }/js/ajaxfileupload.js"></script>
</head>
<script type="text/javascript">
	function fileChange(){
		$.ajaxFileUpload({
			url:"${pageContext.request.contextPath}/prod/ajaxImg.action",
			secureuri: false,
			fileElementId: 'pimage',
			dataType:"json",
			success:function (obj) {
				//清空div
				$("#imgDiv").empty();
				//创建一个图片的标签
				var imgObj = $("<img>");
				alert(obj.imgurl);
				imgObj.attr("src","/image_big/"+obj.imgurl);
				imgObj.attr("width","100px");
				imgObj.attr("height","100px");
				//将图片追加到imgDiv
				$("#imgDiv").append(imgObj);
			}
		});

	}
</script>
<body>
<!--取出上一个页面上带来的page的值-->

<div id="addAll">
	<div id="nav">
		<p>商品管理>新增商品</p>
	</div>

	<div id="table">
		<form  id="myform" action="${pageContext.request.contextPath}/prod/updateTwo.action" enctype="multipart/form-data">
			<input type="hidden" name="pImage" value="${info.pImage}">
			<input type="hidden" name="pId" value="${info.pId}">
<%--			<input type="hidden" name="pDate" value="${info.pDate}">--%>
			<table>
				<tr>
					<td class="one">商品名称</td>
					<td><input type="text" name="pName" value="${info.pName}" class="two"></td>
				</tr>
				<!--错误提示-->
				<tr class="three">
					<td class="four"></td>
					<td><span id="pnameerr"></span></td>
				</tr>
				<tr>
					<td class="one">商品介绍</td>
					<td><input type="text" name="pContent" value="${info.pContent}" class="two"></td>
				</tr>
				<!--错误提示-->
				<tr class="three">
					<td class="four"></td>
					<td><span id="pcontenterr"></span></td>
				</tr>
				<tr>
					<td class="one">定价</td>
					<td><input type="number" name="pPrice" value="${info.pPrice}" class="two"></td>
				</tr>
				<!--错误提示-->
				<tr class="three">
					<td class="four"></td>
					<td><span id="priceerr"></span></td>
				</tr>

				<tr>
				<tr>
					<td class="one">图片介绍</td>
					<td> <br><div id="imgDiv" style="display:block; width: 40px; height: 50px;"><img src="/image_big/${prod.pImage}" width="100px" height="100px" ></div><br><br><br><br>
						<input type="file" id="pimage" name="pimage" onchange="fileChange()">
						<span id="imgName"></span><br>

					</td>
				</tr>
				</tr>
				<tr class="three">
					<td class="four"></td>
					<td><span></span></td>
				</tr>

				<tr>
					<td class="one">总数量</td>
					<td><input type="number" name="pNumber" value="${info.pNumber}" class="two"></td>
				</tr>
				<!--错误提示-->
				<tr class="three">
					<td class="four"></td>
					<td><span id="numerr"></span></td>
				</tr>


				<tr>
					<td class="one">类别</td>
					<td>
						<select name="typeId" >
							<c:forEach items="${application}" var="type">
								<option value="${type.typeId}">${type.typeName}</option>
							</c:forEach>
						</select>
					</td>
				</tr>
				<!--错误提示-->
				<tr class="three">
					<td class="four"></td>
					<td><span></span></td>
				</tr>

				<tr>
					<td>
						<input type="submit" value="提交" class="btn btn-success">
					</td>
					<td>
						<input type="reset" value="取消" class="btn btn-default" onclick="myclose(${param.page})">
						<script type="text/javascript">
							function myclose(ispage) {
								window.location="${pageContext.request.contextPath}/prod/split.action?page="+ispage;
							}
						</script>
					</td>
				</tr>
			</table>
		</form>
	</div>
</div>

</body>

</html>

商品修改第二步：提交修改信息到`controller`层，接收数据封装成`ProductInfo`实体

    // 修改商品信息第二步：获取提交的信息
    @RequestMapping("/updateTwo")
    public String update(ProductInfo info,Model model){
        System.out.println(info);
        // 判断图片是否被修改过，如果修改则重新设置值
        if (saveFileName!=""){
            info.setpImage(saveFileName);
        }
        System.out.println(saveFileName);
        int i = 0;
        try {
            i = service.updateProdInfo(info);
        } catch (Exception e) {
            e.printStackTrace();
        }
        if (i>0){
            // 表示修改商品成功
            model.addAttribute("msg","修改商品信息成功！");
        }else {
            model.addAttribute("msg","修改商品信息失败！");
        }
        // 重新对saveFileName赋值为""空字符串
        saveFileName = "";
        return "forward:/prod/split.action";
    }

service接口

    // 修改商品信息
    int updateProdInfo(ProductInfo productInfo);

service接口实现类

    // 修改商品信息
    @Override
    public int updateProdInfo(ProductInfo productInfo) {
        return mapper.updateByPrimaryKey(productInfo);
    }

昱晟168

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
添加新的商品信息

修改商品信息注意是：由于商品图片是使用ajax请求发送的，在添加和修改时都需要使用到，所以需要定义saveFileName用于保存图片名称，在修改商品信息时，用户有可能对象商品信息进行修改，也有可能不进行修改，所以我们需要在商品添加和修改时保存后将商品saveFileName重新赋值为""空字符串商品修改第一步：根据ID查询信息并且在页面回显数据1.获取要修改商品的ID<button type="button" onclick="updateOne(${p.pId})" class="btn
复制链接

扫一扫