第3章业务功能开发（修改市场活动）

最新推荐文章于 2023-11-15 13:41:49 发布

做一道光

最新推荐文章于 2023-11-15 13:41:49 发布

阅读量176

点赞数 3

分类专栏： CRM项目实战（SSM版）文章标签： mybatis java mysql mvc spring

本文链接：https://blog.csdn.net/weixin_59334478/article/details/125751790

版权

CRM项目实战（SSM版）专栏收录该内容

48 篇文章 10 订阅

订阅专栏

客户需求：

用户在市场活动主页面,选择要修改的市场活动,点击"修改"按钮,弹出修改市场活动的模态窗口;

用户在修改市场活动的模态窗口填写表单,点击"更新"按钮,完成修改市场活动的功能.

*每次能且只能修改一条市场活动

*所有者动态的

*表单验证(同创建)

*修改成功之后,关闭模态窗口,刷新市场活动列表,保持页号和每页显示条数都不变

*修改失败,提示信息,模态窗口不关闭,列表也不刷新

功能开发知识点：

1，封装参数：
1)如果做查询条件，或者参数之间不是属于一个实体类对象，封装成map
2)如果做写数据，并且参数本来就是属于一个实体类对象，封装成实体类对象.

2，使用jquery获取或者设置指定元素的value属性值：
获取：选择器.val();
设置：选择器.val(属性值);

功能开发

1.根据客户需求画出实现数据回显的UML时序图

2.mapper层

ActivityMapper接口

ActivityMapper.xml文件

3.service层

ActivityService接口

ActivityServiceImpl类

4.controller层

ActivityController类

 @RequestMapping(value = "/workbench/activity/saveEditActivity.do")
    @ResponseBody
    public Object saveEditActivity(Activity activity, HttpSession session) {
        User user = (User) session.getAttribute(Contants.SESSION_USER);
        //封装参数
        activity.setEditTime(DateUtils.formateDateTime(new Date()));
        activity.setEditBy(user.getId());
        ReturnObject returnObject=new ReturnObject();
        try {
            //调用service层方法，保存修改市场活动
            int ret = activityService.saveEditActivity(activity);
            if (ret>0){
                returnObject.setCode(Contants.RETURN_OBJECT_CODE_SUCCESS);
            }else {
                returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
                returnObject.setMessage("系统忙，请稍后重试！");
            }
        } catch (Exception e) {
            e.printStackTrace();
            returnObject.setCode(Contants.RETURN_OBJECT_CODE_FAIL);
            returnObject.setMessage("系统忙，请稍后重试！");
        }
        return returnObject;
    }

5.index.jsp页面

实现本功能Js代码

		//给修改模态窗口中的"更新"按钮添加单击事件
        $("#saveEditActivityBtn").click(function () {
            //收集参数
            var id=$("#edit-id").val();
            var owner=$("#edit-marketActivityOwner").val();
            var name=$.trim($("#edit-marketActivityName").val());
            var startDate=$("#edit-startTime").val();
            var endDate=$("#edit-endTime").val();
            var cost=$.trim($("#edit-cost").val());
            var description=$.trim($("#edit-describe").val());
            //验证表单
            if (owner==""){
                alert("所有者不能为空!");
                return;
            }
            if (name==""){
                alert("名称不能为空!");
                return;
            }
            if (startDate!="" && endDate!=""){
                //使用字符串的大小代替日期大小
                if (endDate<startDate){
                    alert("结束日期不能比开始日期小!");
                    return;
                }
            }
            var regExp=/^(([1-9]\d*)|0)$/;
            if (!regExp.test(cost)){
                alert("成本只能是非负整数！");
                return;
            }
            //发送请求
            $.ajax({
                url:"workbench/activity/saveEditActivity.do",
                data:{
                    id:id,
                    owner:owner,
                    name:name,
                    startDate:startDate,
                    endDate:endDate,
                    cost:cost,
                    description:description
                },
                type:'post',
                dataType:'json',
                success:function (data) {
                    if (data.code=="1"){
                        //关闭模态窗口看
                        $("#editActivityModal").modal("hide");
                        //刷新市场活动列表，保持页号和每页显示条数不变
                        queryActivityByConditionForPage(
                            $("#demo_pag1").bs_pagination("getOption","currentPage"),
                            $("#demo_pag1").bs_pagination("getOption","rowsPerPage")
                        );
                    }else {
                        //提示信息
                        alert(data.message);
                        //模态窗口不关闭2
                        $("#editActivityModal").modal("show");
                    }
                }
            });
        });

页面详细代码

<%@page contentType="text/html; charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
	<base href="<%=basePath%>">
<link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<link href="jquery/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" />
<link href="jquery/bs_pagination-master/css/jquery.bs_pagination.min.css">

<script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
<script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
<script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/locale/bootstrap-datetimepicker.zh-CN.js"></script>
<script type="text/javascript" src="jquery/bs_pagination-master/js/jquery.bs_pagination.min.js"></script>
<script type="text/javascript" src="jquery/bs_pagination-master/localization/en.js"></script>
	<script type="text/javascript">

	$(function () {
		//给“创建”按钮添加单击事件
		$("#createActivityBtn").click(function () {
            //初始化工作
            $("#createActivityForm").get(0).reset();
			//弹出创建市场活动的模态窗口
			$("#createActivityModal").modal("show");
		});

		//给保存按钮添加单击事件
		$("#saveCreateActivityBtn").click(function () {
			//收集参数
			var owner=$("#create-marketActivityOwner").val();
			var name=$.trim($("#create-marketActivityName").val());
			var startDate=$("#create-startTime").val();
			var endDate=$("#create-endTime").val();
			var cost=$.trim($("#create-cost").val());
			var description=$.trim($("#create-describe").val());
			//表单验证
			if (owner==""){
				alert("所有者不能为空!");
				return;
			}
			if (name==""){
			    alert("名称不能为空!");
				return;
			}
			if (startDate!="" && endDate!=""){
				//使用字符串的大小代替日期大小
				if (endDate<startDate){
					alert("结束日期不能比开始日期小!");
					return;
				}
			}
			var regExp=/^(([1-9]\d*)|0)$/;
			if (!regExp.test(cost)){
			    alert("成本只能是非负整数！");
			    return;
            }
			//发送请求
            $.ajax({
                url:"workbench/activity/saveCreateActivity.do",
                type:'post',
                data:{
                    owner:owner,
                    name:name,
                    startDate:startDate,
                    endDate:endDate,
                    cost:cost,
                    description:description
                },
                dataType:'json',
                success:function (data) {
                    if (data.code=="1"){
                        //关闭模态窗口
                        $("#createActivityModal").modal("hide");
                        //刷新市场活动列，显示第一页数据，保持每页显示条数不变
						queryActivityByConditionForPage(1,$("#demo_pag1").bs_pagination("getOption","rowsPerPage"));
                    }else {
                        //提示信息
                        alert(data.message);
                        //模态窗口不关闭
                        $("#createActivityModal").modal("show");
                    }
                }
            });
		});

		//当容器加载完成之后，对容器调用工具函数
        $(".mydate").datetimepicker({
           language:'zh-CN',//语言
            format:'yyyy-mm-dd',//日期的格式
            minView:'month',//可以选择的最小视图
            initialDate:new Date(),//初始化显示的日期
            autoclose:true,//选择完日期后自动关闭日历
            todayBtn:true,//设置是否显示今天的按钮
            clearBtn:true//设置是否显示清空按钮
        });

		//当市场活动主页面加载完成后，查询所有数据的第一页，以及所有数据的总条数,默认每页显示10条
		queryActivityByConditionForPage(1,10);
        //给查询按钮添加单击事件
		$("#queryActivityBtn").click(function () {
			//查询所有符合条件数据的第一页以及所有符合条件数据的总条数
			queryActivityByConditionForPage(1,$("#demo_pag1").bs_pagination("getOption","rowsPerPage"));
		});

		//给"全选"按钮添加单击事件
        $("#checkAll").click(function () {
            //如果“全选”按钮是选中状态，那么列表中的所有checkbox都是选中状态
            $("#tBody input[type='checkbox']").prop("checked",this.checked);
        });
        //给数据项的多选框添加单击事件
     $("#tBody").on("click","input[type='checkbox']",function () {
         //如果列表中的所有checkbox都选中，则“全选”按钮也选中
         if ($("#tBody input[type='checkbox']").size()==$("#tBody input[type='checkbox']:checked").size()){
             $("#checkAll").prop("checked",true);
         }else {//如果列表中的所有checkbox有一个没有选中，则“全选”按钮也不选中
             $("#checkAll").prop("checked",false);
         }
     });

     //给删除按钮添加单击事件
		$("#removeActivityBtn").click(function () {
			//收集参数,获取列表中所有被选中的checkbox
			var checkedIds=$("#tBody input[type='checkbox']:checked");
			//表单验证
			if (checkedIds.size()==0){
				alert("请选择要删除的市场活动！");
				return;
			}
			var ids=""
			$.each(checkedIds,function () {//id=xxx&id=xxx&....id=xxx&
				ids+="id="+this.value+"&";
			});
			ids=ids.substr(0,ids.length-1);
		if (window.confirm("确定删除吗？")){
			//发送请求
			$.ajax({
				url:"workbench/activity/removeActivityByIds.do",
				type:'post',
				data:ids,
				dataType:'json',
				success:function (data) {
					if (data.code==1) {
						//刷新市场活动列表，显示第一页数据，保持每页显示的数据条数不变
						queryActivityByConditionForPage(1,$("#demo_pag1").bs_pagination("getOption","rowsPerPage"));
					}else {
						//提示信息
						alert(data.message);
					}
				}
			});
		}
		});

		//给修改按钮添加单击事件
		$("#editActivityBtn").click(function () {
			//收集参数，获取列表中被选中的checkbox
			var checkId=$("#tBody input[type='checkbox']:checked");
			//表单验证
			if (checkId.size()==0){
				alert("请选择要执行的市场活动！");
				return;
			}
			if (checkId.size()>1){
				alert("每次只能选择一条数据");
				return;
			}
			var id=checkId.val();
			//发送请求
			$.ajax({
				url:"workbench/activity/queryActivityById.do",
				data:{
					id:id
				},
				type:'post',
				dataType:'json',
				success:function (data) {
					//把市场活动的信息，显示在修改的模态窗口上
					$("#edit-id").val(data.id);
					$("#edit-marketActivityOwner").val(data.owner);
					$("#edit-marketActivityName").val(data.name);
					$("#edit-startTime").val(data.startDate);
					$("#edit-endTime").val(data.endDate);
					$("#edit-cost").val(data.cost);
					$("#edit-describe").val(data.description);
					//弹出模态窗口
					$("#editActivityModal").modal("show");
				}
			});
		});

		//给修改模态窗口中的"更新"按钮添加单击事件
        $("#saveEditActivityBtn").click(function () {
            //收集参数
            var id=$("#edit-id").val();
            var owner=$("#edit-marketActivityOwner").val();
            var name=$.trim($("#edit-marketActivityName").val());
            var startDate=$("#edit-startTime").val();
            var endDate=$("#edit-endTime").val();
            var cost=$.trim($("#edit-cost").val());
            var description=$.trim($("#edit-describe").val());
            //验证表单
            if (owner==""){
                alert("所有者不能为空!");
                return;
            }
            if (name==""){
                alert("名称不能为空!");
                return;
            }
            if (startDate!="" && endDate!=""){
                //使用字符串的大小代替日期大小
                if (endDate<startDate){
                    alert("结束日期不能比开始日期小!");
                    return;
                }
            }
            var regExp=/^(([1-9]\d*)|0)$/;
            if (!regExp.test(cost)){
                alert("成本只能是非负整数！");
                return;
            }
            //发送请求
            $.ajax({
                url:"workbench/activity/saveEditActivity.do",
                data:{
                    id:id,
                    owner:owner,
                    name:name,
                    startDate:startDate,
                    endDate:endDate,
                    cost:cost,
                    description:description
                },
                type:'post',
                dataType:'json',
                success:function (data) {
                    if (data.code=="1"){
                        //关闭模态窗口看
                        $("#editActivityModal").modal("hide");
                        //刷新市场活动列表，保持页号和每页显示条数不变
                        queryActivityByConditionForPage(
                            $("#demo_pag1").bs_pagination("getOption","currentPage"),
                            $("#demo_pag1").bs_pagination("getOption","rowsPerPage")
                        );
                    }else {
                        //提示信息
                        alert(data.message);
                        //模态窗口不关闭2
                        $("#editActivityModal").modal("show");
                    }
                }
            });
        });


	});
	function queryActivityByConditionForPage(pageNo,pageSize){
		//收集参数
		var name=$("#query-name").val();
		var owner =$("#query-owner").val();
		var startDate=$("#query-startDate").val();
		var endDate=$("#query-endDate").val();
		//发送请求
		$.ajax({
			url:'workbench/activity/queryActivityByConditionForPage.do',
			type: 'post',
			data: {
				name:name,
				owner:owner,
				startDate:startDate,
				endDate:endDate,
				pageNo:pageNo,
				pageSize:pageSize
			},
			dataType: 'json',
			success:function (data) {
				//显示总条数
				// $("#totalRowsB").html(data.totalRows);
				//显示市场活动的列表
				//遍历activityList,拼接所有的行数据
				var htmlStr="";
				$.each(data.activityList,function (index,obj) {
					htmlStr+="<tr class=\"active\">";
					htmlStr+="<td><input type=\"checkbox\" value=\""+obj.id+"\" /></td>";
					htmlStr+="<td><a style=\"text-decoration: none; cursor: pointer;\" onclick=\"window.location.href='detail.html';\">"+obj.name+"</a></td>";
					htmlStr+="<td>"+obj.owner+"</td>";
					htmlStr+="<td>"+obj.startDate+"</td>";
					htmlStr+="<td>"+obj.endDate+"</td>";
					htmlStr+="</tr>";
				});
				$("#tBody").html(htmlStr);

				//取消全选按钮
                $("#checkAll").prop("checked",false);

				//计算总页数
				var totalPages=1;
				if (data.totalRows%pageSize==0){
					totalPages=data.totalRows/pageSize;
				}else {
					totalPages=parseInt(data.totalRows/pageSize)+1;
				}
				//对容器调用bs_pagination工具函数，显示翻页信息
				$("#demo_pag1").bs_pagination({
					currentPage:pageNo,//当前页号，相当于pageNo
					rowsPerPage:pageSize,//每页显示行数，相当于pageSize
					totalRows:data.totalRows,//总条数
					totalPages:totalPages,//总页数
					visiblePageLinks:10,//最多可以显示的卡片数

					onChangePage:function (event,pageObj) {
						queryActivityByConditionForPage(pageObj.currentPage,pageObj.rowsPerPage);
					}
				});
			}
		});
	}

	
</script>
</head>
<body>

	<!-- 创建市场活动的模态窗口 -->
	<div class="modal fade" id="createActivityModal" role="dialog">
		<div class="modal-dialog" role="document" style="width: 85%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title" id="myModalLabel1">创建市场活动</h4>
				</div>
				<div class="modal-body">
				
					<form id="createActivityForm" class="form-horizontal" role="form">
					
						<div class="form-group">
							<label for="create-marketActivityOwner" class="col-sm-2 control-label">所有者<span style="font-size: 15px; color: red;">*</span></label>
							<div class="col-sm-10" style="width: 300px;">
								<select class="form-control" id="create-marketActivityOwner">
									<c:forEach items="${requestScope.userList}" var="user">
										<option value=${user.id}>${user.name}</option>
									</c:forEach>
								</select>
							</div>
                            <label for="create-marketActivityName" class="col-sm-2 control-label">名称<span style="font-size: 15px; color: red;">*</span></label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="create-marketActivityName">
                            </div>
						</div>
						
						<div class="form-group">
							<label for="create-startTime" class="col-sm-2 control-label">开始日期</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control mydate" id="create-startTime" readonly>
							</div>
							<label for="create-endTime" class="col-sm-2 control-label">结束日期</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control mydate" id="create-endTime" readonly>
							</div>
						</div>
                        <div class="form-group">

                            <label for="create-cost" class="col-sm-2 control-label">成本</label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="create-cost">
                            </div>
                        </div>
						<div class="form-group">
							<label for="create-describe" class="col-sm-2 control-label">描述</label>
							<div class="col-sm-10" style="width: 81%;">
								<textarea class="form-control" rows="3" id="create-describe"></textarea>
							</div>
						</div>
						
					</form>
					
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" id="saveCreateActivityBtn">保存</button>
				</div>
			</div>
		</div>
	</div>
	
	<!-- 修改市场活动的模态窗口 -->
	<div class="modal fade" id="editActivityModal" role="dialog">
		<div class="modal-dialog" role="document" style="width: 85%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title" id="myModalLabel2">修改市场活动</h4>
				</div>
				<div class="modal-body">
				
					<form class="form-horizontal" role="form">
					<input type="hidden" id="edit-id">
						<div class="form-group">
							<label for="edit-marketActivityOwner" class="col-sm-2 control-label">所有者<span style="font-size: 15px; color: red;">*</span></label>
							<div class="col-sm-10" style="width: 300px;">
								<select class="form-control" id="edit-marketActivityOwner">
									<c:forEach items="${requestScope.userList}" var="user">
										<option value="${user.id}">${user.name}</option>
									</c:forEach>
								</select>
							</div>
                            <label for="edit-marketActivityName" class="col-sm-2 control-label">名称<span style="font-size: 15px; color: red;">*</span></label>
                            <div class="col-sm-10" style="width: 300px;">
                                <input type="text" class="form-control" id="edit-marketActivityName" value="发传单">
                            </div>
						</div>

						<div class="form-group">
							<label for="edit-startTime" class="col-sm-2 control-label">开始日期</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control mydate" id="edit-startTime" value="2020-10-10">
							</div>
							<label for="edit-endTime" class="col-sm-2 control-label">结束日期</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control mydate" id="edit-endTime" value="2020-10-20">
							</div>
						</div>
						
						<div class="form-group">
							<label for="edit-cost" class="col-sm-2 control-label">成本</label>
							<div class="col-sm-10" style="width: 300px;">
								<input type="text" class="form-control" id="edit-cost" value="5,000">
							</div>
						</div>
						
						<div class="form-group">
							<label for="edit-describe" class="col-sm-2 control-label">描述</label>
							<div class="col-sm-10" style="width: 81%;">
								<textarea class="form-control" rows="3" id="edit-describe">市场活动Marketing，是指品牌主办或参与的展览会议与公关市场活动，包括自行主办的各类研讨会、客户交流会、演示会、新产品发布会、体验会、答谢会、年会和出席参加并布展或演讲的展览会、研讨会、行业交流会、颁奖典礼等</textarea>
							</div>
						</div>
						
					</form>
					
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" id="saveEditActivityBtn">更新</button>
				</div>
			</div>
		</div>
	</div>
	
	<!-- 导入市场活动的模态窗口 -->
    <div class="modal fade" id="importActivityModal" role="dialog">
        <div class="modal-dialog" role="document" style="width: 85%;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel">导入市场活动</h4>
                </div>
                <div class="modal-body" style="height: 350px;">
                    <div style="position: relative;top: 20px; left: 50px;">
                        请选择要上传的文件：<small style="color: gray;">[仅支持.xls]</small>
                    </div>
                    <div style="position: relative;top: 40px; left: 50px;">
                        <input type="file" id="activityFile">
                    </div>
                    <div style="position: relative; width: 400px; height: 320px; left: 45% ; top: -40px;" >
                        <h3>重要提示</h3>
                        <ul>
                            <li>操作仅针对Excel，仅支持后缀名为XLS的文件。</li>
                            <li>给定文件的第一行将视为字段名。</li>
                            <li>请确认您的文件大小不超过5MB。</li>
                            <li>日期值以文本形式保存，必须符合yyyy-MM-dd格式。</li>
                            <li>日期时间以文本形式保存，必须符合yyyy-MM-dd HH:mm:ss的格式。</li>
                            <li>默认情况下，字符编码是UTF-8 (统一码)，请确保您导入的文件使用的是正确的字符编码方式。</li>
                            <li>建议您在导入真实数据之前用测试文件测试文件导入功能。</li>
                        </ul>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button id="importActivityBtn" type="button" class="btn btn-primary">导入</button>
                </div>
            </div>
        </div>
    </div>
	
	
	<div>
		<div style="position: relative; left: 10px; top: -10px;">
			<div class="page-header">
				<h3>市场活动列表</h3>
			</div>
		</div>
	</div>
	<div style="position: relative; top: -20px; left: 0px; width: 100%; height: 100%;">
		<div style="width: 100%; position: absolute;top: 5px; left: 10px;">
		
			<div class="btn-toolbar" role="toolbar" style="height: 80px;">
				<form class="form-inline" role="form" style="position: relative;top: 8%; left: 5px;">
				  
				  <div class="form-group">
				    <div class="input-group">
				      <div class="input-group-addon">名称</div>
				      <input class="form-control" type="text" id="query-name">
				    </div>
				  </div>
				  
				  <div class="form-group">
				    <div class="input-group">
				      <div class="input-group-addon">所有者</div>
				      <input class="form-control" type="text" id="query-owner">
				    </div>
				  </div>


				  <div class="form-group">
				    <div class="input-group">
				      <div class="input-group-addon">开始日期</div>
					  <input class="form-control mydate" type="text" id="query-startDate">
				    </div>
				  </div>
				  <div class="form-group">
				    <div class="input-group">
				      <div class="input-group-addon">结束日期</div>
					  <input class="form-control mydate" type="text" id="query-endDate">
				    </div>
				  </div>
				  
				  <button type="button" class="btn btn-default" id="queryActivityBtn">查询</button>
				  
				</form>
			</div>
			<div class="btn-toolbar" role="toolbar" style="background-color: #F7F7F7; height: 50px; position: relative;top: 5px;">
				<div class="btn-group" style="position: relative; top: 18%;">
				  <button type="button" class="btn btn-primary" id="createActivityBtn"><span class="glyphicon glyphicon-plus"></span> 创建</button>
				  <button type="button" class="btn btn-default" id="editActivityBtn"><span class="glyphicon glyphicon-pencil"></span> 修改</button>
				  <button type="button" class="btn btn-danger" id="removeActivityBtn"><span class="glyphicon glyphicon-minus"></span> 删除</button>
				</div>
				<div class="btn-group" style="position: relative; top: 18%;">
                    <button type="button" class="btn btn-default" data-toggle="modal" data-target="#importActivityModal" ><span class="glyphicon glyphicon-import"></span> 上传列表数据（导入）</button>
                    <button id="exportActivityAllBtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-export"></span> 下载列表数据（批量导出）</button>
                    <button id="exportActivityXzBtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-export"></span> 下载列表数据（选择导出）</button>
                </div>
			</div>
			<div style="position: relative;top: 10px;">
				<table class="table table-hover">
					<thead>
						<tr style="color: #B3B3B3;">
							<td><input type="checkbox" id="checkAll" /></td>
							<td>名称</td>
                            <td>所有者</td>
							<td>开始日期</td>
							<td>结束日期</td>
						</tr>
					</thead>
					<tbody id="tBody">

					</tbody>
				</table>
				<div id="demo_pag1"></div>
			</div>

			
		</div>
		
	</div>
</body>
</html>

功能测试：

点击修改每页显示2条，选中第二页第一条数据，点击修改

更改时，当名称为空时

结束日期不能小于开始日期

成本只能是非负整数

表单按照要求填写完成后，点击更新按钮，关闭模态窗口,刷新市场活动列表,保持页号和每页显示条数都不变

做一道光

关注

3
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
第3章业务功能开发（修改市场活动）

客户需求：用户在市场活动主页面,选择要修改的市场活动,点击"修改"按钮,弹出修改市场活动的模态窗口;用户在修改市场活动的模态窗口填写表单,点击"更新"按钮,完成修改市场活动的功能.*每次能且只能修改一条市场活动*所有者动态的*表单验证(同创建)*修改成功之后,关闭模态窗口,刷新市场活动列表,保持页号和每页显示条数都不变*修改失败,提示信息,模态窗口不关闭,列表也不刷新功能开发知识点：1，封装参数： 1)如果做查询条件，或者参数之间不是属于一个实体类对象，封装成map 2)如果做写数据，并且参数
复制链接

扫一扫