修改员工
- 点击编辑
- 发送ajax请求查询当条员工信息,弹出修改模态框
- 点击更新,发送ajax请求修改。
为编辑按钮绑定单击事件失效的问题:
页面加载完成之后执行js代码,显示的所有数据都是发送的ajax请求拿到的json数据,一般绑定方法是失效的
是在按钮创建之前绑定了点击事件,故失效
使用.live()、on()绑定单击事件
// 为编辑按钮绑定单击事件失效的问题:页面加载完成之后执行js代码,显示的所有数据都是发送的ajax请求拿到的json数据,一般绑定方法是失效的
// 是在按钮创建之前绑定了点击事件,故失效
// 使用.live()、on()绑定单击事件
$(document).on("click",".edit_btn",function () { // 新版绑定点击事件方法
// 查出下拉菜单部门信息、员工信息
getDept("#dept_update_select");
getEmp($(this).attr("edit_id"));
// 将员工id传给模态框的更新按钮
$("#emp_update_btn").attr("edit_id",$(this).attr("edit_id"));
// 弹出模态框
$("#empUpdateModal").modal({
backdrop: 'static'
});
});
血案:更新的点击事件
- 按钮点击事件
- 数据校验正则表达式
- 向服务器发送ajax请求,因使用rest风格的url,data须指出_method=PUT请求
- 出现未知异常,数据并为修改成功,但不报错,解决中:在控制层打印出
更新数据Employee{empId=null, empName=‘null’, gender=‘null’, email=‘jerry123123@qq.com’, dId=1, department=null}
- 5.1 将更新方法上的{id}更改为{empId},即可修改成功
5.2 如果不使用_method=PUT,发送post请求的写法,请求体中有数据但是Employe封装不上,原因:Tomcat将请求体中的数据封装为一个map。 获取参数时会从这个map中取值,那你只获取了id,肯定其他参数都为null。这是ajax发送put请求引发的血案。(request.getParameter(empName)=null),只有post请求才封装请求体
Request类源码中:
protected String parseBodyMethods = “POST”
if(!getConnector().isParseBodyMethod(getMethod)){
success = true;
return;}
$("#emp_update_btn").click(function () {
var emailText = $("#email_update_input").val();
var emailPatt = /^([a-z0-9_\.-]+)@([\da-z\.-]+)\.([a-z\.]{2,6})$/;
if (!emailPatt.test(emailText)){
$("#update_email_patt_msg").text("邮箱格式有误");
return false;
}
$.ajax({
url:"/emp/"+$(this).attr("edit_id"),
// type:"POST",
type:"PUT",
// data:$("#empUpdateModal form").serialize()+"&_method=PUT",
data:$("#empUpdateModal form").serialize(),
// 在web.xml中配置过滤器HttpPutFormContentFilter
success:function (data) {
alert(data.msg)
}
});
});
PUT请求失效解决
- 发送type="PUT"请求,不使用_method="PUT"的情况下:
- 在web.xml中配置HttpPutFormContentFilter配置(springmvc提供过滤器)
原理:
包装了一个自定义map,重写了getParameter方法,从自己封装的map中取数据
作用:将请求体中的数据解析包装成一个map,request被重新包装,getParameter()方法被重写,从自己封装的map中取数据
<!-- rest风格PUT请求的数据参数封装问题-->
<filter>
<filter-name>httpPutFormContentFilter</filter-name>
<filter-class>org.springframework.web.filter.HttpPutFormContentFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>httpPutFormContentFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>